Comparing version 0.4.7 to 0.5.0
@@ -31,2 +31,30 @@ 'use strict'; | ||
function __generator(thisArg, body) { | ||
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; | ||
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; | ||
function verb(n) { return function (v) { return step([n, v]); }; } | ||
function step(op) { | ||
if (f) throw new TypeError("Generator is already executing."); | ||
while (_) try { | ||
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; | ||
if (y = 0, t) op = [op[0] & 2, t.value]; | ||
switch (op[0]) { | ||
case 0: case 1: t = op; break; | ||
case 4: _.label++; return { value: op[1], done: false }; | ||
case 5: _.label++; y = op[1]; op = [0]; continue; | ||
case 7: op = _.ops.pop(); _.trys.pop(); continue; | ||
default: | ||
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } | ||
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } | ||
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } | ||
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } | ||
if (t[2]) _.ops.pop(); | ||
_.trys.pop(); continue; | ||
} | ||
op = body.call(thisArg, _); | ||
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } | ||
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; | ||
} | ||
} | ||
function __values(o) { | ||
@@ -61,7 +89,6 @@ var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; | ||
/** @deprecated */ | ||
function __spread() { | ||
for (var ar = [], i = 0; i < arguments.length; i++) | ||
ar = ar.concat(__read(arguments[i])); | ||
return ar; | ||
function __spreadArray(to, from) { | ||
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++) | ||
to[j] = from[i]; | ||
return to; | ||
} | ||
@@ -194,3 +221,3 @@ | ||
var removeDupesFromArray = function removeDupesFromArray(array) { | ||
return __spread(new Set(array)); | ||
return __spreadArray([], __read(new Set(array))); | ||
}; | ||
@@ -232,3 +259,3 @@ | ||
}; | ||
return new (Function.bind.apply(Function, __spread([void 0], Object.keys(specialProperties), [formattedExpression])))().apply(void 0, __spread(Object.values(specialProperties))); | ||
return new (Function.bind.apply(Function, __spreadArray(__spreadArray([void 0], __read(Object.keys(specialProperties))), [formattedExpression])))().apply(void 0, __spreadArray([], __read(Object.values(specialProperties)))); | ||
} | ||
@@ -323,3 +350,3 @@ } catch (err) { | ||
}); | ||
depsInFunctions.push.apply(depsInFunctions, __spread(depsInFunction)); | ||
depsInFunctions.push.apply(depsInFunctions, __spreadArray([], __read(depsInFunction))); | ||
} | ||
@@ -336,4 +363,4 @@ | ||
var uniqueCompiledDeps = removeDupesFromArray(__spread(deps, depsInFunctions)); | ||
nodeDeps.push.apply(nodeDeps, __spread(uniqueCompiledDeps)); | ||
var uniqueCompiledDeps = removeDupesFromArray(__spreadArray(__spreadArray([], __read(deps)), __read(depsInFunctions))); | ||
nodeDeps.push.apply(nodeDeps, __spreadArray([], __read(uniqueCompiledDeps))); | ||
var directiveData = { | ||
@@ -397,3 +424,3 @@ compute: computeExpression(value, el, returnable, refs), | ||
if (childNode.hasAttribute(DIRECTIVE_PREFIX + "state")) continue; | ||
collection.push.apply(collection, __spread(flattenNodeChildren(childNode, isListGroup))); | ||
collection.push.apply(collection, __spreadArray([], __read(flattenNodeChildren(childNode, isListGroup)))); | ||
} | ||
@@ -461,2 +488,17 @@ } | ||
var concurrent = function concurrent(generatorFunction) { | ||
var generator = generatorFunction(); | ||
return function next() { | ||
var start = performance.now(); | ||
var task = null; | ||
do { | ||
task = generator.next(); | ||
} while (performance.now() - start < 25 && !task.done); | ||
if (task.done) return; | ||
setTimeout(next); | ||
}; | ||
}; | ||
var render = function render(ast, directives, state, changedProps) { | ||
@@ -471,70 +513,161 @@ if (state === void 0) { | ||
if (typeof changedProps === 'string') changedProps = [changedProps]; | ||
var legalDirectiveNames = Object.keys(directives); | ||
concurrent(function () { | ||
var _loop_1, ast_1, ast_1_1, node, e_1_1; | ||
var _loop_1 = function _loop_1(i) { | ||
var e_1, _a; | ||
var node = ast[i]; | ||
if (node.type === ASTNodeType.NULL) return "continue"; | ||
var isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) node.type = ASTNodeType.NULL; | ||
var nodeHasDep = changedProps.some(function (prop) { | ||
return node.deps.includes(prop); | ||
}); | ||
if (!nodeHasDep && !isStatic) return "continue"; | ||
return __generator(this, function (_b) { | ||
switch (_b.label) { | ||
case 0: | ||
_loop_1 = function _loop_1(node) { | ||
var isStatic, nodeHasDep, _loop_2, _c, _d, _e, directiveName, directiveData, e_2_1; | ||
var _loop_2 = function _loop_2(directiveName, directiveData) { | ||
var rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) return "continue"; | ||
var directiveHasDep = changedProps.some(function (prop) { | ||
return directiveData.deps.includes(prop); | ||
}); | ||
var isMaskDirective = directiveName === DIRECTIVE_PREFIX + "mask"; | ||
var isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
var e_2, _f; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
var directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node: node, | ||
state: state | ||
}; | ||
renderDirective(directiveProps, directives); | ||
return __generator(this, function (_g) { | ||
switch (_g.label) { | ||
case 0: | ||
isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) node.type = ASTNodeType.NULL; | ||
nodeHasDep = changedProps.some(function (prop) { | ||
return node.deps.includes(prop); | ||
}); | ||
if (!nodeHasDep && !isStatic) return [2, "continue"]; | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
_loop_2 = function _loop_2(directiveName, directiveData) { | ||
var rawDirectiveName, directiveHasDep, isMaskDirective, isStaticDirective, directiveProps; | ||
return __generator(this, function (_h) { | ||
switch (_h.label) { | ||
case 0: | ||
return [4]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(DIRECTIVE_PREFIX + "mask"); | ||
case 1: | ||
_h.sent(); | ||
rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) return [2, "continue"]; | ||
directiveHasDep = changedProps.some(function (prop) { | ||
return directiveData.deps.includes(prop); | ||
}); | ||
isMaskDirective = directiveName === DIRECTIVE_PREFIX + "mask"; | ||
isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node: node, | ||
state: state | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(DIRECTIVE_PREFIX + "mask"); | ||
} | ||
} | ||
} | ||
return [2]; | ||
} | ||
}); | ||
}; | ||
_g.label = 1; | ||
case 1: | ||
_g.trys.push([1, 6, 7, 8]); | ||
_c = (e_2 = void 0, __values(Object.entries(node.directives))), _d = _c.next(); | ||
_g.label = 2; | ||
case 2: | ||
if (!!_d.done) return [3, 5]; | ||
_e = __read(_d.value, 2), directiveName = _e[0], directiveData = _e[1]; | ||
return [5, _loop_2(directiveName, directiveData)]; | ||
case 3: | ||
_g.sent(); | ||
_g.label = 4; | ||
case 4: | ||
_d = _c.next(); | ||
return [3, 2]; | ||
case 5: | ||
return [3, 8]; | ||
case 6: | ||
e_2_1 = _g.sent(); | ||
e_2 = { | ||
error: e_2_1 | ||
}; | ||
return [3, 8]; | ||
case 7: | ||
try { | ||
if (_d && !_d.done && (_f = _c["return"])) _f.call(_c); | ||
} finally { | ||
if (e_2) throw e_2.error; | ||
} | ||
return [7]; | ||
case 8: | ||
return [2]; | ||
} | ||
}); | ||
}; | ||
_b.label = 1; | ||
case 1: | ||
_b.trys.push([1, 6, 7, 8]); | ||
ast_1 = __values(ast), ast_1_1 = ast_1.next(); | ||
_b.label = 2; | ||
case 2: | ||
if (!!ast_1_1.done) return [3, 5]; | ||
node = ast_1_1.value; | ||
return [5, _loop_1(node)]; | ||
case 3: | ||
_b.sent(); | ||
_b.label = 4; | ||
case 4: | ||
ast_1_1 = ast_1.next(); | ||
return [3, 2]; | ||
case 5: | ||
return [3, 8]; | ||
case 6: | ||
e_1_1 = _b.sent(); | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
return [3, 8]; | ||
case 7: | ||
try { | ||
if (ast_1_1 && !ast_1_1.done && (_a = ast_1["return"])) _a.call(ast_1); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
} | ||
}; | ||
try { | ||
for (var _b = (e_1 = void 0, __values(Object.entries(node.directives))), _c = _b.next(); !_c.done; _c = _b.next()) { | ||
var _d = __read(_c.value, 2), | ||
directiveName = _d[0], | ||
directiveData = _d[1]; | ||
return [7]; | ||
_loop_2(directiveName, directiveData); | ||
case 8: | ||
return [2]; | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (_c && !_c.done && (_a = _b["return"])) _a.call(_b); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
}; | ||
for (var i = 0; i < ast.length; i++) { | ||
_loop_1(i); | ||
} | ||
}); | ||
})(); | ||
}; | ||
@@ -550,3 +683,3 @@ | ||
var childNode = ast_1_1.value; | ||
deps.push.apply(deps, __spread(childNode.deps)); | ||
deps.push.apply(deps, __spreadArray([], __read(childNode.deps))); | ||
} | ||
@@ -565,3 +698,3 @@ } catch (e_1_1) { | ||
var cleanedDeps = removeDupesFromArray(__spread(currentDeps, deps)); | ||
var cleanedDeps = removeDupesFromArray(__spreadArray(__spreadArray([], __read(currentDeps)), __read(deps))); | ||
node.deps = cleanedDeps; | ||
@@ -738,3 +871,3 @@ node.directives[directiveName].deps = cleanedDeps; | ||
if ((currArray === null || currArray === void 0 ? void 0 : currArray.length) === 0) el.innerHTML = '';else if (arrayDiff !== 0) { | ||
for (var i = Math.abs(arrayDiff); i > 0; i--) { | ||
for (var i = Math.abs(arrayDiff); i > 0; --i) { | ||
if (arrayDiff < 0) el.removeChild(el.lastChild);else { | ||
@@ -764,3 +897,3 @@ var tag = template.startsWith('<th') ? 'thead' : template.startsWith('<td') || template.startsWith('<tr') ? 'tbody' : 'div'; | ||
render(compile(el, state), directives, state, node.deps); | ||
render(compile(el, state, true), directives, state, node.deps); | ||
}; | ||
@@ -802,3 +935,3 @@ | ||
if (typeof state[key] === 'function') return false; | ||
if (typeof state[key] === 'function' || key.startsWith('$')) return false; | ||
var hasArrayMutationKey = !isNaN(Number(key)) || key === 'length'; | ||
@@ -808,12 +941,10 @@ var props = [key]; | ||
if (target instanceof Array && hasArrayMutationKey) { | ||
props = Object.keys(state).filter(function (prop) { | ||
return arrayEquals(state[prop], target); | ||
}); | ||
props.push.apply(props, __spreadArray([], __read(Object.keys(state).filter(function (prop) { | ||
return state[prop] instanceof Array && arrayEquals(state[prop], target); | ||
})))); | ||
} else { | ||
if (Object.keys(state).some(function (prop) { | ||
return target[prop] === undefined; | ||
})) { | ||
props = Object.keys(state).filter(function (prop) { | ||
return _typeof(state[prop]) === 'object'; | ||
}); | ||
if (!Object.is(target, state)) { | ||
props.push.apply(props, __spreadArray([], __read(Object.keys(state).filter(function (prop) { | ||
return _typeof(state[prop]) === 'object' && JSON.stringify(state[prop]).indexOf(key) > -1; | ||
})))); | ||
} | ||
@@ -890,2 +1021,3 @@ } | ||
setElementCustomProp(rootEl, 'component', this); | ||
this.handleMutations(rootEl); | ||
return this.state; | ||
@@ -910,2 +1042,39 @@ }; | ||
Component.prototype.handleMutations = function (el) { | ||
var _this = this; | ||
var mutationObserver = new MutationObserver(function (mutationsList) { | ||
var e_1, _a; | ||
try { | ||
for (var mutationsList_1 = __values(mutationsList), mutationsList_1_1 = mutationsList_1.next(); !mutationsList_1_1.done; mutationsList_1_1 = mutationsList_1.next()) { | ||
var mutation = mutationsList_1_1.value; | ||
var attrName = String(mutation.attributeName); | ||
if (mutation.type === 'attributes' && attrName.startsWith(DIRECTIVE_PREFIX) && attrName !== DIRECTIVE_PREFIX + "for") { | ||
_this.ast = compile(el, _this.state); | ||
_this.render(); | ||
console.log('render'); | ||
} | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (mutationsList_1_1 && !mutationsList_1_1.done && (_a = mutationsList_1["return"])) _a.call(mutationsList_1); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
}); | ||
mutationObserver.observe(el, { | ||
attributes: true, | ||
subtree: true | ||
}); | ||
}; | ||
return Component; | ||
@@ -927,3 +1096,3 @@ }(); | ||
var uninitializedComponents = __spread(componentElements).filter(function (el) { | ||
var uninitializedComponents = __spreadArray([], __read(componentElements)).filter(function (el) { | ||
return getElementCustomProp(el, 'component') === undefined; | ||
@@ -930,0 +1099,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 o(t){return(o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}!function(t){t["@"]="on",t[":"]="bind"}(i||(i={}));var a,l=function(t){return t.replace(/\s+/gim," ").trim()};!function(t){t[t.NULL=-1]="NULL",t[t.STATIC=0]="STATIC",t[t.DYNAMIC=1]="DYNAMIC"}(a||(a={}));var u=function(t){return new RegExp("\\b"+t+"\\b","gim")},s=function(t,e){return t[e]},c=function(t,e,r){t[e]=r},f=function(t){return n(new Set(t))},v=function(t,e,r,i){void 0===r&&(r=!0),void 0===i&&(i={});var o="with($state){"+(r?"return "+t:t)+"}";return function(r,a){try{var l=r[t];if(l)return"function"==typeof l?r[t]():l;var u={$state:r,$el:e,$emit:function(t,r,n){void 0===n&&(n=!0);var i=new CustomEvent(t,r);(n?window:e||window).dispatchEvent(i)},$event:a,$refs:i};return(new(Function.bind.apply(Function,n([void 0],Object.keys(u),[o])))).apply(void 0,n(Object.values(u)))}catch(r){console.warn('Lucia Error: "'+r+'"\n\nExpression: "'+t+'"\nElement:',e)}}},d=function(t){return t.hasAttribute("l-for")},p=function(t,e){var n=r(y(t,e),2),i=n[0],o=n[1],l=Object.keys(i).length>0,s=Object.values(i).some((function(t){var r=t.value;return Object.keys(e).some((function(t){return u(t).test(r)}))}))?a.DYNAMIC:a.STATIC;return l?{el:t,deps:o,directives:i,type:s}:void 0},y=function(t,r){var o,a;void 0===r&&(r={});var l={},d=function(){var t,r,n=document.querySelectorAll("[l-ref]"),i={};try{for(var o=e(n),a=o.next();!a.done;a=o.next()){var l=a.value,u=l.getAttribute("l-ref");u&&(i[u]=l)}}catch(e){t={error:e}}finally{try{a&&!a.done&&(r=o.return)&&r.call(o)}finally{if(t)throw t.error}}return i}(),p=[],y=function(e,o){var a="l-state"===e,y=e.startsWith("l-"),h=Object.keys(i).some((function(t){return e.startsWith(t)}));if(a||!y&&!h)return"continue";var m=[],b=Object.keys(r),g=!0,x=b.filter((function(t){var e=u(t).test(String(o));if(e&&"function"==typeof r[t]){var i=b.filter((function(e){return u(e).test(String(r[t]))}));m.push.apply(m,n(i))}return e}));/on|@/gim.test(e)&&(g=!1),e.includes("for")&&void 0===s(t,"__for_template")&&(c(t,"__for_template",String(t.innerHTML).trim()),g=!1);var w=f(n(x,m));p.push.apply(p,n(w));var A={compute:v(o,t,g,d),deps:w,value:o},j=y?e.slice("l-".length):i[e[0]]+":"+e.slice(1);l[j.toLowerCase()]=A};try{for(var h=e(t.attributes),m=h.next();!m.done;m=h.next()){var b=m.value;y(b.name,b.value)}}catch(t){o={error:t}}finally{try{m&&!m.done&&(a=h.return)&&a.call(h)}finally{if(o)throw o.error}}return[l,f(p)]},h=function t(r,i,o){var a,l;void 0===i&&(i=!1),void 0===o&&(o=!1);var u,s=[],c=d(r),f=!!(u=r).parentElement&&u.parentElement.hasAttribute("l-for");if(!i&&(c||f))return s;if(o||i&&c||s.push(r),i||!c&&!f)try{for(var v=e(r.childNodes),p=v.next();!p.done;p=v.next()){var y=p.value;if(y.nodeType===Node.ELEMENT_NODE)if(!i&&d(y))s.push(y);else{if(y.hasAttribute("l-state"))continue;s.push.apply(s,n(t(y,i)))}}}catch(t){a={error:t}}finally{try{p&&!p.done&&(l=v.return)&&l.call(v)}finally{if(a)throw a.error}}return s},m=function(t,r,n){var o,a;void 0===r&&(r={}),void 0===n&&(n=!1);var l=[],u=void 0!==s(t,"component")&&d(t),c=h(t,u,n),f="l-mask";try{for(var v=e(c),y=v.next();!y.done;y=v.next()){var m=y.value;if(m.hasAttribute(f)&&m.removeAttribute(f),new RegExp("(l-|"+Object.keys(i).join("|")+")\\w+","gim").test(m.outerHTML)){var b=p(m,r);b&&l.push(b)}}}catch(t){o={error:t}}finally{try{y&&!y.done&&(a=v.return)&&a.call(v)}finally{if(o)throw o.error}}return l},b=function(t,n,i,o){void 0===i&&(i={}),void 0===o&&(o=[]),"string"==typeof o&&(o=[o]);for(var l=Object.keys(n),u=function(u){var s,c,f=t[u];if(f.type===a.NULL)return"continue";var v=f.type===a.STATIC;if(v&&(f.type=a.NULL),!o.some((function(t){return f.deps.includes(t)}))&&!v)return"continue";var d=function(t,e){var r=t.split(/:|\./)[0];if(!l.includes(r.toUpperCase()))return"continue";var a=o.some((function(t){return e.deps.includes(t)})),u="l-mask"===t,s=0===Object.keys(e.deps).length;if(a||v||s){var c={el:f.el,parts:t.split(/:|\./gim),data:e,node:f,state:i};w(c,n),(s||u)&&(delete f.directives[t],u&&f.el.removeAttribute("l-mask"))}};try{for(var p=(s=void 0,e(Object.entries(f.directives))),y=p.next();!y.done;y=p.next()){var h=r(y.value,2);d(h[0],h[1])}}catch(t){s={error:t}}finally{try{y&&!y.done&&(c=p.return)&&c.call(p)}finally{if(s)throw s.error}}},s=0;s<t.length;s++)u(s)},g=function(t,r,i,o){var a,l,u=[];try{for(var s=e(t),c=s.next();!c.done;c=s.next()){var v=c.value;u.push.apply(u,n(v.deps))}}catch(t){a={error:t}}finally{try{c&&!c.done&&(l=s.return)&&l.call(s)}finally{if(a)throw a.error}}var d=f(n(r,u));i.deps=d,i.directives[o].deps=d},x={BIND:function(t){var e=t.el,r=t.parts,n=t.data,i=t.state;switch(r[1]){case"class":var a=n.compute(i);if("string"==typeof a)return e.setAttribute("class",l(e.className+" "+a));if(a instanceof Array)return e.setAttribute("class",l(e.className+" "+a.join(" ")));var u=[];for(var s in a)a[s]&&u.push(s);var c=new RegExp("\\b"+Object.keys(a).join("|")+"\\b","gim"),f=e.className.replace(c,"");if(u.length>0)return e.setAttribute("class",l(f+" "+u.join(" ")));if(l(f).length>0)return e.setAttribute("class",l(f));if(e.hasAttribute("class"))return e.removeAttribute("class");break;case"style":var v=n.compute(i);for(var s in e.removeAttribute("style"),v)e.style[s]=v[s];break;default:var d=n.compute(i);if("object"===o(d)&&null!==d)for(var s in d)d[s]?e.setAttribute(s,d[s]):e.removeAttribute(s);else d?e.setAttribute(r[1],d):e.removeAttribute(r[1])}},HTML:function(t){var e,r=t.el,n=t.data,i=t.state,o=t.node;o=o;var a=s(r,"component");r.innerHTML=null!==(e=n.compute(i))&&void 0!==e?e:n.value;var l=m(r,i,!0);a||g(l,n.deps,o,"html"),b(l,x,i,n.deps),c(r,"component",!0)},MODEL:function(t){var e=t.el,r=t.parts,n=t.data,i=t.state,o=e,a=i[n.value],l="checkbox"===o.type?"checked":"value";if(o[l]!==String(a)&&(o[l]=a),!s(o,"__model_registered")){o.addEventListener("debounce"===r[1]?"change":"input",(function(){return function(t,e,r,n){"checkbox"===t.type&&(t.value=String(t.checked));var i,o="number"==typeof e&&!isNaN(t.value),a="boolean"==typeof e&&("true"===t.value||"false"===t.value),l=null==e&&("null"===t.value||"undefined"===t.value);return i=o?parseFloat(t.value):a?"true"===t.value:l?"null"===t.value?null:void 0:String(t.value),n[r.value]=i,i}(o,a,n,i)})),c(o,"__model_registered",!0)}},SHOW:function(t){var e=t.el,r=t.data,n=t.state;e.style.display=r.compute(n)?"":"none",0===e.style.length&&e.removeAttribute("style")},ON:function(t){var r=t.el,n=t.parts,i=t.data,o=t.state,a={},l=n.slice(2);if(!s(r,"__on_"+n[1]+"_registered")){var u=["outside","global"].some((function(t){return String(l).includes(t)}))?window:r;a.once=l.includes("once"),a.passive=l.includes("passive"),u.addEventListener(n[1],(function(t){var n,a;if(t instanceof KeyboardEvent&&/\d/gim.test(String(l))){var u=[];try{for(var s=e(l),c=s.next();!c.done;c=s.next()){var f=c.value;isNaN(f)||u.push(Number(f))}}catch(t){n={error:t}}finally{try{c&&!c.done&&(a=s.return)&&a.call(s)}finally{if(n)throw n.error}}if(!u.includes(t.keyCode))return}if(l.includes("prevent")&&t.preventDefault(),l.includes("stop")&&t.stopPropagation(),!l.includes("self")||t.target===r){if(l.includes("outside")){if(r.contains(t.target))return;if(r.offsetWidth<1&&r.offsetHeight<1)return}i.compute(o,t)}}),a),c(r,"__on_"+n[1]+"_registered",!0)}},TEXT:function(t){var e,r=t.el,n=t.data,i=t.state;r.textContent=null!==(e=n.compute(i))&&void 0!==e?e:n.value},FOR:function(t){var e,n=t.el,i=t.data,o=t.state,a=t.node;a=a;var l=s(n,"component");c(n,"component",!0);var f=r(i.value.split(/\s+(?:in|of)\s+/gim),2),d=f[0],p=f[1],y=r(null==d?void 0:d.trim().replace(/\(|\)/gim,"").split(","),2),h=y[0],w=y[1],A=null!==(e=o[null==p?void 0:p.trim()])&&void 0!==e?e:v(null==p?void 0:p.trim(),n,!0)(o),j=m(n,o),O=s(n,"__for_template");n.innerHTML.trim()===O&&(n.innerHTML="");var S=(null==A?void 0:A.length)-n.children.length;if(0===(null==A?void 0:A.length))n.innerHTML="";else if(0!==S)for(var _=Math.abs(S);_>0;_--)if(S<0)n.removeChild(n.lastChild);else{var k=O.startsWith("<th")?"thead":O.startsWith("<td")||O.startsWith("<tr")?"tbody":"div",N=document.createElement(k),E=O;h&&(E=E.replace(u("this\\."+h.trim()),p+"["+(A.length-_)+"]")),w&&(E=E.replace(u("this\\."+w.trim()),String(A.length-_))),N.innerHTML=E,n.appendChild(N.firstElementChild)}l||(g(j,i.deps,a,"for"),n.removeAttribute("l-for")),b(m(n,o),x,o,a.deps)}},w=function(t,e){e[t.parts[0].toUpperCase()](t)},A=function(t,n,i){void 0===i&&(i={});var a={get:function(t,e){return"object"===o(t[e])&&null!==t[e]?new Proxy(t[e],a):t[e]},set:function(a,l,u){var s,c;if("function"==typeof t[l])return!1;var f=!isNaN(Number(l))||"length"===l,v=[l];a instanceof Array&&f?v=Object.keys(t).filter((function(e){return r=t[e],n=a,r instanceof Array&&n instanceof Array&&r.length===n.length&&r.every((function(t,e){return t===n[e]}));var r,n})):Object.keys(t).some((function(t){return void 0===a[t]}))&&(v=Object.keys(t).filter((function(e){return"object"===o(t[e])}))),a[l]=u,n(v);try{for(var d=e(Object.entries(i)),p=d.next();!p.done;p=d.next()){var y=r(p.value,2),h=y[0],m=y[1];v.includes(h)&&m()}}catch(t){s={error:t}}finally{try{p&&!p.done&&(c=d.return)&&c.call(d)}finally{if(s)throw s.error}}return!0}};return new Proxy(Object.seal(t),a)},j=function(){function e(t,e,r){void 0===t&&(t={}),void 0===e&&(e={}),void 0===r&&(r={}),this.state=t,this.directives=e,this.watchers=r}return e.prototype.mount=function(e){var r=this,n="string"==typeof e?document.querySelector(e):e;return this.ast=m(n,this.state),this.directives=t(t({},this.directives),x),this.state=A(t(t({},this.state),{$render:function(t){return void 0===t&&(t=Object.keys(r.state)),r.render(t)}}),this.render.bind(this),this.watchers),this.render(),c(n,"component",this),this.state},e.prototype.directive=function(t,e){this.directives[t.toUpperCase()]=e},e.prototype.watch=function(t,e){this.watchers[t]=e},e.prototype.render=function(t){void 0===t&&(t=Object.keys(this.state)),b(this.ast,x,this.state,t)},e}(),O=function(t){return new j(t)};exports.compile=m,exports.component=O,exports.computeExpression=v,exports.directives=x,exports.init=function(t){var r,i;void 0===t&&(t=document);var o="l-state",a=n(t.querySelectorAll("[l-state]")).filter((function(t){return void 0===s(t,"component")}));try{for(var l=e(a),u=l.next();!u.done;u=l.next()){var c=u.value,f=c.getAttribute(o),d=v(""+(f||"{}"),c,!0)({});O(d).mount(c)}}catch(t){r={error:t}}finally{try{u&&!u.done&&(i=l.return)&&i.call(l)}finally{if(r)throw r.error}}},exports.reactive=A,exports.render=b; | ||
"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,t){var r,n,i,o,a={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return o={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function l(o){return function(l){return function(o){if(r)throw new TypeError("Generator is already executing.");for(;a;)try{if(r=1,n&&(i=2&o[0]?n.return:o[0]?n.throw||((i=n.return)&&i.call(n),0):n.next)&&!(i=i.call(n,o[1])).done)return i;switch(n=0,i&&(o=[2&o[0],i.value]),o[0]){case 0:case 1:i=o;break;case 4:return a.label++,{value:o[1],done:!1};case 5:a.label++,n=o[1],o=[0];continue;case 7:o=a.ops.pop(),a.trys.pop();continue;default:if(!(i=a.trys,(i=i.length>0&&i[i.length-1])||6!==o[0]&&2!==o[0])){a=0;continue}if(3===o[0]&&(!i||o[1]>i[0]&&o[1]<i[3])){a.label=o[1];break}if(6===o[0]&&a.label<i[1]){a.label=i[1],i=o;break}if(i&&a.label<i[2]){a.label=i[2],a.ops.push(o);break}i[2]&&a.ops.pop(),a.trys.pop();continue}o=t.call(e,a)}catch(e){o=[6,e],n=0}finally{r=i=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,l])}}}function r(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 n(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 i(e,t){for(var r=0,n=t.length,i=e.length;r<n;r++,i++)e[i]=t[r];return e}var o;function a(e){return(a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}!function(e){e["@"]="on",e[":"]="bind"}(o||(o={}));var l,u=function(e){return e.replace(/\s+/gim," ").trim()};!function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(l||(l={}));var s=function(e){return new RegExp("\\b"+e+"\\b","gim")},c=function(e,t){return e[t]},f=function(e,t,r){e[t]=r},v=function(e){return i([],n(new Set(e)))},d=function(e,t,r,o){void 0===r&&(r=!0),void 0===o&&(o={});var a="with($state){"+(r?"return "+e:e)+"}";return function(r,l){try{var u=r[e];if(u)return"function"==typeof u?r[e]():u;var s={$state:r,$el:t,$emit:function(e,r,n){void 0===n&&(n=!0);var i=new CustomEvent(e,r);(n?window:t||window).dispatchEvent(i)},$event:l,$refs:o};return(new(Function.bind.apply(Function,i(i([void 0],n(Object.keys(s))),[a])))).apply(void 0,i([],n(Object.values(s))))}catch(r){console.warn('Lucia Error: "'+r+'"\n\nExpression: "'+e+'"\nElement:',t)}}},p=function(e){return e.hasAttribute("l-for")},y=function(e,t){var r=n(h(e,t),2),i=r[0],o=r[1],a=Object.keys(i).length>0,u=Object.values(i).some((function(e){var r=e.value;return Object.keys(t).some((function(e){return s(e).test(r)}))}))?l.DYNAMIC:l.STATIC;return a?{el:e,deps:o,directives:i,type:u}:void 0},h=function(e,t){var a,l;void 0===t&&(t={});var u={},p=function(){var e,t,n=document.querySelectorAll("[l-ref]"),i={};try{for(var o=r(n),a=o.next();!a.done;a=o.next()){var l=a.value,u=l.getAttribute("l-ref");u&&(i[u]=l)}}catch(t){e={error:t}}finally{try{a&&!a.done&&(t=o.return)&&t.call(o)}finally{if(e)throw e.error}}return i}(),y=[],h=function(r,a){var l="l-state"===r,h=r.startsWith("l-"),b=Object.keys(o).some((function(e){return r.startsWith(e)}));if(l||!h&&!b)return"continue";var m=[],g=Object.keys(t),w=!0,x=g.filter((function(e){var r=s(e).test(String(a));if(r&&"function"==typeof t[e]){var o=g.filter((function(r){return s(r).test(String(t[e]))}));m.push.apply(m,i([],n(o)))}return r}));/on|@/gim.test(r)&&(w=!1),r.includes("for")&&void 0===c(e,"__for_template")&&(f(e,"__for_template",String(e.innerHTML).trim()),w=!1);var A=v(i(i([],n(x)),n(m)));y.push.apply(y,i([],n(A)));var O={compute:d(a,e,w,p),deps:A,value:a},S=h?r.slice("l-".length):o[r[0]]+":"+r.slice(1);u[S.toLowerCase()]=O};try{for(var b=r(e.attributes),m=b.next();!m.done;m=b.next()){var g=m.value;h(g.name,g.value)}}catch(e){a={error:e}}finally{try{m&&!m.done&&(l=b.return)&&l.call(b)}finally{if(a)throw a.error}}return[u,v(y)]},b=function e(t,o,a){var l,u;void 0===o&&(o=!1),void 0===a&&(a=!1);var s,c=[],f=p(t),v=!!(s=t).parentElement&&s.parentElement.hasAttribute("l-for");if(!o&&(f||v))return c;if(a||o&&f||c.push(t),o||!f&&!v)try{for(var d=r(t.childNodes),y=d.next();!y.done;y=d.next()){var h=y.value;if(h.nodeType===Node.ELEMENT_NODE)if(!o&&p(h))c.push(h);else{if(h.hasAttribute("l-state"))continue;c.push.apply(c,i([],n(e(h,o))))}}}catch(e){l={error:e}}finally{try{y&&!y.done&&(u=d.return)&&u.call(d)}finally{if(l)throw l.error}}return c},m=function(e,t,n){var i,a;void 0===t&&(t={}),void 0===n&&(n=!1);var l=[],u=void 0!==c(e,"component")&&p(e),s=b(e,u,n),f="l-mask";try{for(var v=r(s),d=v.next();!d.done;d=v.next()){var h=d.value;if(h.hasAttribute(f)&&h.removeAttribute(f),new RegExp("(l-|"+Object.keys(o).join("|")+")\\w+","gim").test(h.outerHTML)){var m=y(h,t);m&&l.push(m)}}}catch(e){i={error:e}}finally{try{d&&!d.done&&(a=v.return)&&a.call(v)}finally{if(i)throw i.error}}return l},g=function(e,i,o,a){void 0===o&&(o={}),void 0===a&&(a=[]);var u,s=Object.keys(i);(u=function(){var u,c,f,v,d,p,y;return t(this,(function(h){switch(h.label){case 0:u=function(e){var u,c,f,v,d,p,y,h,b,m;return t(this,(function(g){switch(g.label){case 0:if((u=e.type===l.STATIC)&&(e.type=l.NULL),!a.some((function(t){return e.deps.includes(t)}))&&!u)return[2,"continue"];c=function(r,n){var l,c,f,v,d;return t(this,(function(t){switch(t.label){case 0:return[4];case 1:return t.sent(),l=r.split(/:|\./)[0],s.includes(l.toUpperCase())?(c=a.some((function(e){return n.deps.includes(e)})),f="l-mask"===r,v=0===Object.keys(n.deps).length,(c||u||v)&&(d={el:e.el,parts:r.split(/:|\./gim),data:n,node:e,state:o},A(d,i),(v||f)&&(delete e.directives[r],f&&e.el.removeAttribute("l-mask"))),[2]):[2,"continue"]}}))},g.label=1;case 1:g.trys.push([1,6,7,8]),b=void 0,f=r(Object.entries(e.directives)),v=f.next(),g.label=2;case 2:return v.done?[3,5]:(d=n(v.value,2),p=d[0],y=d[1],[5,c(p,y)]);case 3:g.sent(),g.label=4;case 4:return v=f.next(),[3,2];case 5:return[3,8];case 6:return h=g.sent(),b={error:h},[3,8];case 7:try{v&&!v.done&&(m=f.return)&&m.call(f)}finally{if(b)throw b.error}return[7];case 8:return[2]}}))},h.label=1;case 1:h.trys.push([1,6,7,8]),c=r(e),f=c.next(),h.label=2;case 2:return f.done?[3,5]:(v=f.value,[5,u(v)]);case 3:h.sent(),h.label=4;case 4:return f=c.next(),[3,2];case 5:return[3,8];case 6:return d=h.sent(),p={error:d},[3,8];case 7:try{f&&!f.done&&(y=c.return)&&y.call(c)}finally{if(p)throw p.error}return[7];case 8:return[2]}}))}(),function e(){var t=performance.now(),r=null;do{r=u.next()}while(performance.now()-t<25&&!r.done);r.done||setTimeout(e)})()},w=function(e,t,o,a){var l,u,s=[];try{for(var c=r(e),f=c.next();!f.done;f=c.next()){var d=f.value;s.push.apply(s,i([],n(d.deps)))}}catch(e){l={error:e}}finally{try{f&&!f.done&&(u=c.return)&&u.call(c)}finally{if(l)throw l.error}}var p=v(i(i([],n(t)),n(s)));o.deps=p,o.directives[a].deps=p},x={BIND:function(e){var t=e.el,r=e.parts,n=e.data,i=e.state;switch(r[1]){case"class":var o=n.compute(i);if("string"==typeof o)return t.setAttribute("class",u(t.className+" "+o));if(o instanceof Array)return t.setAttribute("class",u(t.className+" "+o.join(" ")));var l=[];for(var s in o)o[s]&&l.push(s);var c=new RegExp("\\b"+Object.keys(o).join("|")+"\\b","gim"),f=t.className.replace(c,"");if(l.length>0)return t.setAttribute("class",u(f+" "+l.join(" ")));if(u(f).length>0)return t.setAttribute("class",u(f));if(t.hasAttribute("class"))return t.removeAttribute("class");break;case"style":var v=n.compute(i);for(var s in t.removeAttribute("style"),v)t.style[s]=v[s];break;default:var d=n.compute(i);if("object"===a(d)&&null!==d)for(var s in d)d[s]?t.setAttribute(s,d[s]):t.removeAttribute(s);else d?t.setAttribute(r[1],d):t.removeAttribute(r[1])}},HTML:function(e){var t,r=e.el,n=e.data,i=e.state,o=e.node;o=o;var a=c(r,"component");r.innerHTML=null!==(t=n.compute(i))&&void 0!==t?t:n.value;var l=m(r,i,!0);a||w(l,n.deps,o,"html"),g(l,x,i,n.deps),f(r,"component",!0)},MODEL:function(e){var t=e.el,r=e.parts,n=e.data,i=e.state,o=t,a=i[n.value],l="checkbox"===o.type?"checked":"value";if(o[l]!==String(a)&&(o[l]=a),!c(o,"__model_registered")){o.addEventListener("debounce"===r[1]?"change":"input",(function(){return function(e,t,r,n){"checkbox"===e.type&&(e.value=String(e.checked));var i,o="number"==typeof t&&!isNaN(e.value),a="boolean"==typeof t&&("true"===e.value||"false"===e.value),l=null==t&&("null"===e.value||"undefined"===e.value);return i=o?parseFloat(e.value):a?"true"===e.value:l?"null"===e.value?null:void 0:String(e.value),n[r.value]=i,i}(o,a,n,i)})),f(o,"__model_registered",!0)}},SHOW:function(e){var t=e.el,r=e.data,n=e.state;t.style.display=r.compute(n)?"":"none",0===t.style.length&&t.removeAttribute("style")},ON:function(e){var t=e.el,n=e.parts,i=e.data,o=e.state,a={},l=n.slice(2);if(!c(t,"__on_"+n[1]+"_registered")){var u=["outside","global"].some((function(e){return String(l).includes(e)}))?window:t;a.once=l.includes("once"),a.passive=l.includes("passive"),u.addEventListener(n[1],(function(e){var n,a;if(e instanceof KeyboardEvent&&/\d/gim.test(String(l))){var u=[];try{for(var s=r(l),c=s.next();!c.done;c=s.next()){var f=c.value;isNaN(f)||u.push(Number(f))}}catch(e){n={error:e}}finally{try{c&&!c.done&&(a=s.return)&&a.call(s)}finally{if(n)throw n.error}}if(!u.includes(e.keyCode))return}if(l.includes("prevent")&&e.preventDefault(),l.includes("stop")&&e.stopPropagation(),!l.includes("self")||e.target===t){if(l.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}i.compute(o,e)}}),a),f(t,"__on_"+n[1]+"_registered",!0)}},TEXT:function(e){var t,r=e.el,n=e.data,i=e.state;r.textContent=null!==(t=n.compute(i))&&void 0!==t?t:n.value},FOR:function(e){var t,r=e.el,i=e.data,o=e.state,a=e.node;a=a;var l=c(r,"component");f(r,"component",!0);var u=n(i.value.split(/\s+(?:in|of)\s+/gim),2),v=u[0],p=u[1],y=n(null==v?void 0:v.trim().replace(/\(|\)/gim,"").split(","),2),h=y[0],b=y[1],A=null!==(t=o[null==p?void 0:p.trim()])&&void 0!==t?t:d(null==p?void 0:p.trim(),r,!0)(o),O=m(r,o),S=c(r,"__for_template");r.innerHTML.trim()===S&&(r.innerHTML="");var j=(null==A?void 0:A.length)-r.children.length;if(0===(null==A?void 0:A.length))r.innerHTML="";else if(0!==j)for(var k=Math.abs(j);k>0;--k)if(j<0)r.removeChild(r.lastChild);else{var _=S.startsWith("<th")?"thead":S.startsWith("<td")||S.startsWith("<tr")?"tbody":"div",N=document.createElement(_),E=S;h&&(E=E.replace(s("this\\."+h.trim()),p+"["+(A.length-k)+"]")),b&&(E=E.replace(s("this\\."+b.trim()),String(A.length-k))),N.innerHTML=E,r.appendChild(N.firstElementChild)}l||(w(O,i.deps,a,"for"),r.removeAttribute("l-for")),g(m(r,o,!0),x,o,a.deps)}},A=function(e,t){t[e.parts[0].toUpperCase()](e)},O=function(e,t,o){void 0===o&&(o={});var l={get:function(e,t){return"object"===a(e[t])&&null!==e[t]?new Proxy(e[t],l):e[t]},set:function(l,u,s){var c,f;if("function"==typeof e[u]||u.startsWith("$"))return!1;var v=!isNaN(Number(u))||"length"===u,d=[u];l instanceof Array&&v?d.push.apply(d,i([],n(Object.keys(e).filter((function(t){return e[t]instanceof Array&&(r=e[t],n=l,r instanceof Array&&n instanceof Array&&r.length===n.length&&r.every((function(e,t){return e===n[t]})));var r,n}))))):Object.is(l,e)||d.push.apply(d,i([],n(Object.keys(e).filter((function(t){return"object"===a(e[t])&&JSON.stringify(e[t]).indexOf(u)>-1}))))),l[u]=s,t(d);try{for(var p=r(Object.entries(o)),y=p.next();!y.done;y=p.next()){var h=n(y.value,2),b=h[0],m=h[1];d.includes(b)&&m()}}catch(e){c={error:e}}finally{try{y&&!y.done&&(f=p.return)&&f.call(p)}finally{if(c)throw c.error}}return!0}};return new Proxy(Object.seal(e),l)},S=function(){function t(e,t,r){void 0===e&&(e={}),void 0===t&&(t={}),void 0===r&&(r={}),this.state=e,this.directives=t,this.watchers=r}return t.prototype.mount=function(t){var r=this,n="string"==typeof t?document.querySelector(t):t;return this.ast=m(n,this.state),this.directives=e(e({},this.directives),x),this.state=O(e(e({},this.state),{$render:function(e){return void 0===e&&(e=Object.keys(r.state)),r.render(e)}}),this.render.bind(this),this.watchers),this.render(),f(n,"component",this),this.handleMutations(n),this.state},t.prototype.directive=function(e,t){this.directives[e.toUpperCase()]=t},t.prototype.watch=function(e,t){this.watchers[e]=t},t.prototype.render=function(e){void 0===e&&(e=Object.keys(this.state)),g(this.ast,x,this.state,e)},t.prototype.handleMutations=function(e){var t=this;new MutationObserver((function(n){var i,o;try{for(var a=r(n),l=a.next();!l.done;l=a.next()){var u=l.value,s=String(u.attributeName);"attributes"===u.type&&s.startsWith("l-")&&"l-for"!==s&&(t.ast=m(e,t.state),t.render(),console.log("render"))}}catch(e){i={error:e}}finally{try{l&&!l.done&&(o=a.return)&&o.call(a)}finally{if(i)throw i.error}}})).observe(e,{attributes:!0,subtree:!0})},t}(),j=function(e){return new S(e)};exports.compile=m,exports.component=j,exports.computeExpression=d,exports.directives=x,exports.init=function(e){var t,o;void 0===e&&(e=document);var a="l-state",l=i([],n(e.querySelectorAll("[l-state]"))).filter((function(e){return void 0===c(e,"component")}));try{for(var u=r(l),s=u.next();!s.done;s=u.next()){var f=s.value,v=f.getAttribute(a),p=d(""+(v||"{}"),f,!0)({});j(p).mount(f)}}catch(e){t={error:e}}finally{try{s&&!s.done&&(o=u.return)&&o.call(u)}finally{if(t)throw t.error}}},exports.reactive=O,exports.render=g; |
@@ -27,2 +27,30 @@ /*! ***************************************************************************** | ||
function __generator(thisArg, body) { | ||
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; | ||
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; | ||
function verb(n) { return function (v) { return step([n, v]); }; } | ||
function step(op) { | ||
if (f) throw new TypeError("Generator is already executing."); | ||
while (_) try { | ||
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; | ||
if (y = 0, t) op = [op[0] & 2, t.value]; | ||
switch (op[0]) { | ||
case 0: case 1: t = op; break; | ||
case 4: _.label++; return { value: op[1], done: false }; | ||
case 5: _.label++; y = op[1]; op = [0]; continue; | ||
case 7: op = _.ops.pop(); _.trys.pop(); continue; | ||
default: | ||
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } | ||
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } | ||
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } | ||
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } | ||
if (t[2]) _.ops.pop(); | ||
_.trys.pop(); continue; | ||
} | ||
op = body.call(thisArg, _); | ||
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } | ||
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; | ||
} | ||
} | ||
function __values(o) { | ||
@@ -57,7 +85,6 @@ var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; | ||
/** @deprecated */ | ||
function __spread() { | ||
for (var ar = [], i = 0; i < arguments.length; i++) | ||
ar = ar.concat(__read(arguments[i])); | ||
return ar; | ||
function __spreadArray(to, from) { | ||
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++) | ||
to[j] = from[i]; | ||
return to; | ||
} | ||
@@ -190,3 +217,3 @@ | ||
var removeDupesFromArray = function removeDupesFromArray(array) { | ||
return __spread(new Set(array)); | ||
return __spreadArray([], __read(new Set(array))); | ||
}; | ||
@@ -228,3 +255,3 @@ | ||
}; | ||
return new (Function.bind.apply(Function, __spread([void 0], Object.keys(specialProperties), [formattedExpression])))().apply(void 0, __spread(Object.values(specialProperties))); | ||
return new (Function.bind.apply(Function, __spreadArray(__spreadArray([void 0], __read(Object.keys(specialProperties))), [formattedExpression])))().apply(void 0, __spreadArray([], __read(Object.values(specialProperties)))); | ||
} | ||
@@ -319,3 +346,3 @@ } catch (err) { | ||
}); | ||
depsInFunctions.push.apply(depsInFunctions, __spread(depsInFunction)); | ||
depsInFunctions.push.apply(depsInFunctions, __spreadArray([], __read(depsInFunction))); | ||
} | ||
@@ -332,4 +359,4 @@ | ||
var uniqueCompiledDeps = removeDupesFromArray(__spread(deps, depsInFunctions)); | ||
nodeDeps.push.apply(nodeDeps, __spread(uniqueCompiledDeps)); | ||
var uniqueCompiledDeps = removeDupesFromArray(__spreadArray(__spreadArray([], __read(deps)), __read(depsInFunctions))); | ||
nodeDeps.push.apply(nodeDeps, __spreadArray([], __read(uniqueCompiledDeps))); | ||
var directiveData = { | ||
@@ -393,3 +420,3 @@ compute: computeExpression(value, el, returnable, refs), | ||
if (childNode.hasAttribute(DIRECTIVE_PREFIX + "state")) continue; | ||
collection.push.apply(collection, __spread(flattenNodeChildren(childNode, isListGroup))); | ||
collection.push.apply(collection, __spreadArray([], __read(flattenNodeChildren(childNode, isListGroup)))); | ||
} | ||
@@ -457,2 +484,17 @@ } | ||
var concurrent = function concurrent(generatorFunction) { | ||
var generator = generatorFunction(); | ||
return function next() { | ||
var start = performance.now(); | ||
var task = null; | ||
do { | ||
task = generator.next(); | ||
} while (performance.now() - start < 25 && !task.done); | ||
if (task.done) return; | ||
setTimeout(next); | ||
}; | ||
}; | ||
var render = function render(ast, directives, state, changedProps) { | ||
@@ -467,70 +509,161 @@ if (state === void 0) { | ||
if (typeof changedProps === 'string') changedProps = [changedProps]; | ||
var legalDirectiveNames = Object.keys(directives); | ||
concurrent(function () { | ||
var _loop_1, ast_1, ast_1_1, node, e_1_1; | ||
var _loop_1 = function _loop_1(i) { | ||
var e_1, _a; | ||
var node = ast[i]; | ||
if (node.type === ASTNodeType.NULL) return "continue"; | ||
var isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) node.type = ASTNodeType.NULL; | ||
var nodeHasDep = changedProps.some(function (prop) { | ||
return node.deps.includes(prop); | ||
}); | ||
if (!nodeHasDep && !isStatic) return "continue"; | ||
return __generator(this, function (_b) { | ||
switch (_b.label) { | ||
case 0: | ||
_loop_1 = function _loop_1(node) { | ||
var isStatic, nodeHasDep, _loop_2, _c, _d, _e, directiveName, directiveData, e_2_1; | ||
var _loop_2 = function _loop_2(directiveName, directiveData) { | ||
var rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) return "continue"; | ||
var directiveHasDep = changedProps.some(function (prop) { | ||
return directiveData.deps.includes(prop); | ||
}); | ||
var isMaskDirective = directiveName === DIRECTIVE_PREFIX + "mask"; | ||
var isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
var e_2, _f; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
var directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node: node, | ||
state: state | ||
}; | ||
renderDirective(directiveProps, directives); | ||
return __generator(this, function (_g) { | ||
switch (_g.label) { | ||
case 0: | ||
isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) node.type = ASTNodeType.NULL; | ||
nodeHasDep = changedProps.some(function (prop) { | ||
return node.deps.includes(prop); | ||
}); | ||
if (!nodeHasDep && !isStatic) return [2, "continue"]; | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
_loop_2 = function _loop_2(directiveName, directiveData) { | ||
var rawDirectiveName, directiveHasDep, isMaskDirective, isStaticDirective, directiveProps; | ||
return __generator(this, function (_h) { | ||
switch (_h.label) { | ||
case 0: | ||
return [4]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(DIRECTIVE_PREFIX + "mask"); | ||
case 1: | ||
_h.sent(); | ||
rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) return [2, "continue"]; | ||
directiveHasDep = changedProps.some(function (prop) { | ||
return directiveData.deps.includes(prop); | ||
}); | ||
isMaskDirective = directiveName === DIRECTIVE_PREFIX + "mask"; | ||
isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node: node, | ||
state: state | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(DIRECTIVE_PREFIX + "mask"); | ||
} | ||
} | ||
} | ||
return [2]; | ||
} | ||
}); | ||
}; | ||
_g.label = 1; | ||
case 1: | ||
_g.trys.push([1, 6, 7, 8]); | ||
_c = (e_2 = void 0, __values(Object.entries(node.directives))), _d = _c.next(); | ||
_g.label = 2; | ||
case 2: | ||
if (!!_d.done) return [3, 5]; | ||
_e = __read(_d.value, 2), directiveName = _e[0], directiveData = _e[1]; | ||
return [5, _loop_2(directiveName, directiveData)]; | ||
case 3: | ||
_g.sent(); | ||
_g.label = 4; | ||
case 4: | ||
_d = _c.next(); | ||
return [3, 2]; | ||
case 5: | ||
return [3, 8]; | ||
case 6: | ||
e_2_1 = _g.sent(); | ||
e_2 = { | ||
error: e_2_1 | ||
}; | ||
return [3, 8]; | ||
case 7: | ||
try { | ||
if (_d && !_d.done && (_f = _c["return"])) _f.call(_c); | ||
} finally { | ||
if (e_2) throw e_2.error; | ||
} | ||
return [7]; | ||
case 8: | ||
return [2]; | ||
} | ||
}); | ||
}; | ||
_b.label = 1; | ||
case 1: | ||
_b.trys.push([1, 6, 7, 8]); | ||
ast_1 = __values(ast), ast_1_1 = ast_1.next(); | ||
_b.label = 2; | ||
case 2: | ||
if (!!ast_1_1.done) return [3, 5]; | ||
node = ast_1_1.value; | ||
return [5, _loop_1(node)]; | ||
case 3: | ||
_b.sent(); | ||
_b.label = 4; | ||
case 4: | ||
ast_1_1 = ast_1.next(); | ||
return [3, 2]; | ||
case 5: | ||
return [3, 8]; | ||
case 6: | ||
e_1_1 = _b.sent(); | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
return [3, 8]; | ||
case 7: | ||
try { | ||
if (ast_1_1 && !ast_1_1.done && (_a = ast_1["return"])) _a.call(ast_1); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
} | ||
}; | ||
try { | ||
for (var _b = (e_1 = void 0, __values(Object.entries(node.directives))), _c = _b.next(); !_c.done; _c = _b.next()) { | ||
var _d = __read(_c.value, 2), | ||
directiveName = _d[0], | ||
directiveData = _d[1]; | ||
return [7]; | ||
_loop_2(directiveName, directiveData); | ||
case 8: | ||
return [2]; | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (_c && !_c.done && (_a = _b["return"])) _a.call(_b); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
}; | ||
for (var i = 0; i < ast.length; i++) { | ||
_loop_1(i); | ||
} | ||
}); | ||
})(); | ||
}; | ||
@@ -546,3 +679,3 @@ | ||
var childNode = ast_1_1.value; | ||
deps.push.apply(deps, __spread(childNode.deps)); | ||
deps.push.apply(deps, __spreadArray([], __read(childNode.deps))); | ||
} | ||
@@ -561,3 +694,3 @@ } catch (e_1_1) { | ||
var cleanedDeps = removeDupesFromArray(__spread(currentDeps, deps)); | ||
var cleanedDeps = removeDupesFromArray(__spreadArray(__spreadArray([], __read(currentDeps)), __read(deps))); | ||
node.deps = cleanedDeps; | ||
@@ -734,3 +867,3 @@ node.directives[directiveName].deps = cleanedDeps; | ||
if ((currArray === null || currArray === void 0 ? void 0 : currArray.length) === 0) el.innerHTML = '';else if (arrayDiff !== 0) { | ||
for (var i = Math.abs(arrayDiff); i > 0; i--) { | ||
for (var i = Math.abs(arrayDiff); i > 0; --i) { | ||
if (arrayDiff < 0) el.removeChild(el.lastChild);else { | ||
@@ -760,3 +893,3 @@ var tag = template.startsWith('<th') ? 'thead' : template.startsWith('<td') || template.startsWith('<tr') ? 'tbody' : 'div'; | ||
render(compile(el, state), directives, state, node.deps); | ||
render(compile(el, state, true), directives, state, node.deps); | ||
}; | ||
@@ -798,3 +931,3 @@ | ||
if (typeof state[key] === 'function') return false; | ||
if (typeof state[key] === 'function' || key.startsWith('$')) return false; | ||
var hasArrayMutationKey = !isNaN(Number(key)) || key === 'length'; | ||
@@ -804,12 +937,10 @@ var props = [key]; | ||
if (target instanceof Array && hasArrayMutationKey) { | ||
props = Object.keys(state).filter(function (prop) { | ||
return arrayEquals(state[prop], target); | ||
}); | ||
props.push.apply(props, __spreadArray([], __read(Object.keys(state).filter(function (prop) { | ||
return state[prop] instanceof Array && arrayEquals(state[prop], target); | ||
})))); | ||
} else { | ||
if (Object.keys(state).some(function (prop) { | ||
return target[prop] === undefined; | ||
})) { | ||
props = Object.keys(state).filter(function (prop) { | ||
return _typeof(state[prop]) === 'object'; | ||
}); | ||
if (!Object.is(target, state)) { | ||
props.push.apply(props, __spreadArray([], __read(Object.keys(state).filter(function (prop) { | ||
return _typeof(state[prop]) === 'object' && JSON.stringify(state[prop]).indexOf(key) > -1; | ||
})))); | ||
} | ||
@@ -886,2 +1017,3 @@ } | ||
setElementCustomProp(rootEl, 'component', this); | ||
this.handleMutations(rootEl); | ||
return this.state; | ||
@@ -906,2 +1038,39 @@ }; | ||
Component.prototype.handleMutations = function (el) { | ||
var _this = this; | ||
var mutationObserver = new MutationObserver(function (mutationsList) { | ||
var e_1, _a; | ||
try { | ||
for (var mutationsList_1 = __values(mutationsList), mutationsList_1_1 = mutationsList_1.next(); !mutationsList_1_1.done; mutationsList_1_1 = mutationsList_1.next()) { | ||
var mutation = mutationsList_1_1.value; | ||
var attrName = String(mutation.attributeName); | ||
if (mutation.type === 'attributes' && attrName.startsWith(DIRECTIVE_PREFIX) && attrName !== DIRECTIVE_PREFIX + "for") { | ||
_this.ast = compile(el, _this.state); | ||
_this.render(); | ||
console.log('render'); | ||
} | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (mutationsList_1_1 && !mutationsList_1_1.done && (_a = mutationsList_1["return"])) _a.call(mutationsList_1); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
}); | ||
mutationObserver.observe(el, { | ||
attributes: true, | ||
subtree: true | ||
}); | ||
}; | ||
return Component; | ||
@@ -923,3 +1092,3 @@ }(); | ||
var uninitializedComponents = __spread(componentElements).filter(function (el) { | ||
var uninitializedComponents = __spreadArray([], __read(componentElements)).filter(function (el) { | ||
return getElementCustomProp(el, 'component') === undefined; | ||
@@ -926,0 +1095,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 o(t){return(o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}!function(t){t["@"]="on",t[":"]="bind"}(i||(i={}));var a,l=function(t){return t.replace(/\s+/gim," ").trim()};!function(t){t[t.NULL=-1]="NULL",t[t.STATIC=0]="STATIC",t[t.DYNAMIC=1]="DYNAMIC"}(a||(a={}));var u=function(t){return new RegExp("\\b"+t+"\\b","gim")},s=function(t,e){return t[e]},c=function(t,e,r){t[e]=r},f=function(t){return n(new Set(t))},v=function(t,e,r,i){void 0===r&&(r=!0),void 0===i&&(i={});var o="with($state){"+(r?"return "+t:t)+"}";return function(r,a){try{var l=r[t];if(l)return"function"==typeof l?r[t]():l;var u={$state:r,$el:e,$emit:function(t,r,n){void 0===n&&(n=!0);var i=new CustomEvent(t,r);(n?window:e||window).dispatchEvent(i)},$event:a,$refs:i};return(new(Function.bind.apply(Function,n([void 0],Object.keys(u),[o])))).apply(void 0,n(Object.values(u)))}catch(r){console.warn('Lucia Error: "'+r+'"\n\nExpression: "'+t+'"\nElement:',e)}}},d=function(t){return t.hasAttribute("l-for")},p=function(t,e){var n=r(y(t,e),2),i=n[0],o=n[1],l=Object.keys(i).length>0,s=Object.values(i).some((function(t){var r=t.value;return Object.keys(e).some((function(t){return u(t).test(r)}))}))?a.DYNAMIC:a.STATIC;return l?{el:t,deps:o,directives:i,type:s}:void 0},y=function(t,r){var o,a;void 0===r&&(r={});var l={},d=function(){var t,r,n=document.querySelectorAll("[l-ref]"),i={};try{for(var o=e(n),a=o.next();!a.done;a=o.next()){var l=a.value,u=l.getAttribute("l-ref");u&&(i[u]=l)}}catch(e){t={error:e}}finally{try{a&&!a.done&&(r=o.return)&&r.call(o)}finally{if(t)throw t.error}}return i}(),p=[],y=function(e,o){var a="l-state"===e,y=e.startsWith("l-"),h=Object.keys(i).some((function(t){return e.startsWith(t)}));if(a||!y&&!h)return"continue";var m=[],b=Object.keys(r),g=!0,w=b.filter((function(t){var e=u(t).test(String(o));if(e&&"function"==typeof r[t]){var i=b.filter((function(e){return u(e).test(String(r[t]))}));m.push.apply(m,n(i))}return e}));/on|@/gim.test(e)&&(g=!1),e.includes("for")&&void 0===s(t,"__for_template")&&(c(t,"__for_template",String(t.innerHTML).trim()),g=!1);var A=f(n(w,m));p.push.apply(p,n(A));var x={compute:v(o,t,g,d),deps:A,value:o},j=y?e.slice("l-".length):i[e[0]]+":"+e.slice(1);l[j.toLowerCase()]=x};try{for(var h=e(t.attributes),m=h.next();!m.done;m=h.next()){var b=m.value;y(b.name,b.value)}}catch(t){o={error:t}}finally{try{m&&!m.done&&(a=h.return)&&a.call(h)}finally{if(o)throw o.error}}return[l,f(p)]},h=function t(r,i,o){var a,l;void 0===i&&(i=!1),void 0===o&&(o=!1);var u,s=[],c=d(r),f=!!(u=r).parentElement&&u.parentElement.hasAttribute("l-for");if(!i&&(c||f))return s;if(o||i&&c||s.push(r),i||!c&&!f)try{for(var v=e(r.childNodes),p=v.next();!p.done;p=v.next()){var y=p.value;if(y.nodeType===Node.ELEMENT_NODE)if(!i&&d(y))s.push(y);else{if(y.hasAttribute("l-state"))continue;s.push.apply(s,n(t(y,i)))}}}catch(t){a={error:t}}finally{try{p&&!p.done&&(l=v.return)&&l.call(v)}finally{if(a)throw a.error}}return s},m=function(t,r,n){var o,a;void 0===r&&(r={}),void 0===n&&(n=!1);var l=[],u=void 0!==s(t,"component")&&d(t),c=h(t,u,n),f="l-mask";try{for(var v=e(c),y=v.next();!y.done;y=v.next()){var m=y.value;if(m.hasAttribute(f)&&m.removeAttribute(f),new RegExp("(l-|"+Object.keys(i).join("|")+")\\w+","gim").test(m.outerHTML)){var b=p(m,r);b&&l.push(b)}}}catch(t){o={error:t}}finally{try{y&&!y.done&&(a=v.return)&&a.call(v)}finally{if(o)throw o.error}}return l},b=function(t,n,i,o){void 0===i&&(i={}),void 0===o&&(o=[]),"string"==typeof o&&(o=[o]);for(var l=Object.keys(n),u=function(u){var s,c,f=t[u];if(f.type===a.NULL)return"continue";var v=f.type===a.STATIC;if(v&&(f.type=a.NULL),!o.some((function(t){return f.deps.includes(t)}))&&!v)return"continue";var d=function(t,e){var r=t.split(/:|\./)[0];if(!l.includes(r.toUpperCase()))return"continue";var a=o.some((function(t){return e.deps.includes(t)})),u="l-mask"===t,s=0===Object.keys(e.deps).length;if(a||v||s){var c={el:f.el,parts:t.split(/:|\./gim),data:e,node:f,state:i};A(c,n),(s||u)&&(delete f.directives[t],u&&f.el.removeAttribute("l-mask"))}};try{for(var p=(s=void 0,e(Object.entries(f.directives))),y=p.next();!y.done;y=p.next()){var h=r(y.value,2);d(h[0],h[1])}}catch(t){s={error:t}}finally{try{y&&!y.done&&(c=p.return)&&c.call(p)}finally{if(s)throw s.error}}},s=0;s<t.length;s++)u(s)},g=function(t,r,i,o){var a,l,u=[];try{for(var s=e(t),c=s.next();!c.done;c=s.next()){var v=c.value;u.push.apply(u,n(v.deps))}}catch(t){a={error:t}}finally{try{c&&!c.done&&(l=s.return)&&l.call(s)}finally{if(a)throw a.error}}var d=f(n(r,u));i.deps=d,i.directives[o].deps=d},w={BIND:function(t){var e=t.el,r=t.parts,n=t.data,i=t.state;switch(r[1]){case"class":var a=n.compute(i);if("string"==typeof a)return e.setAttribute("class",l(e.className+" "+a));if(a instanceof Array)return e.setAttribute("class",l(e.className+" "+a.join(" ")));var u=[];for(var s in a)a[s]&&u.push(s);var c=new RegExp("\\b"+Object.keys(a).join("|")+"\\b","gim"),f=e.className.replace(c,"");if(u.length>0)return e.setAttribute("class",l(f+" "+u.join(" ")));if(l(f).length>0)return e.setAttribute("class",l(f));if(e.hasAttribute("class"))return e.removeAttribute("class");break;case"style":var v=n.compute(i);for(var s in e.removeAttribute("style"),v)e.style[s]=v[s];break;default:var d=n.compute(i);if("object"===o(d)&&null!==d)for(var s in d)d[s]?e.setAttribute(s,d[s]):e.removeAttribute(s);else d?e.setAttribute(r[1],d):e.removeAttribute(r[1])}},HTML:function(t){var e,r=t.el,n=t.data,i=t.state,o=t.node;o=o;var a=s(r,"component");r.innerHTML=null!==(e=n.compute(i))&&void 0!==e?e:n.value;var l=m(r,i,!0);a||g(l,n.deps,o,"html"),b(l,w,i,n.deps),c(r,"component",!0)},MODEL:function(t){var e=t.el,r=t.parts,n=t.data,i=t.state,o=e,a=i[n.value],l="checkbox"===o.type?"checked":"value";if(o[l]!==String(a)&&(o[l]=a),!s(o,"__model_registered")){o.addEventListener("debounce"===r[1]?"change":"input",(function(){return function(t,e,r,n){"checkbox"===t.type&&(t.value=String(t.checked));var i,o="number"==typeof e&&!isNaN(t.value),a="boolean"==typeof e&&("true"===t.value||"false"===t.value),l=null==e&&("null"===t.value||"undefined"===t.value);return i=o?parseFloat(t.value):a?"true"===t.value:l?"null"===t.value?null:void 0:String(t.value),n[r.value]=i,i}(o,a,n,i)})),c(o,"__model_registered",!0)}},SHOW:function(t){var e=t.el,r=t.data,n=t.state;e.style.display=r.compute(n)?"":"none",0===e.style.length&&e.removeAttribute("style")},ON:function(t){var r=t.el,n=t.parts,i=t.data,o=t.state,a={},l=n.slice(2);if(!s(r,"__on_"+n[1]+"_registered")){var u=["outside","global"].some((function(t){return String(l).includes(t)}))?window:r;a.once=l.includes("once"),a.passive=l.includes("passive"),u.addEventListener(n[1],(function(t){var n,a;if(t instanceof KeyboardEvent&&/\d/gim.test(String(l))){var u=[];try{for(var s=e(l),c=s.next();!c.done;c=s.next()){var f=c.value;isNaN(f)||u.push(Number(f))}}catch(t){n={error:t}}finally{try{c&&!c.done&&(a=s.return)&&a.call(s)}finally{if(n)throw n.error}}if(!u.includes(t.keyCode))return}if(l.includes("prevent")&&t.preventDefault(),l.includes("stop")&&t.stopPropagation(),!l.includes("self")||t.target===r){if(l.includes("outside")){if(r.contains(t.target))return;if(r.offsetWidth<1&&r.offsetHeight<1)return}i.compute(o,t)}}),a),c(r,"__on_"+n[1]+"_registered",!0)}},TEXT:function(t){var e,r=t.el,n=t.data,i=t.state;r.textContent=null!==(e=n.compute(i))&&void 0!==e?e:n.value},FOR:function(t){var e,n=t.el,i=t.data,o=t.state,a=t.node;a=a;var l=s(n,"component");c(n,"component",!0);var f=r(i.value.split(/\s+(?:in|of)\s+/gim),2),d=f[0],p=f[1],y=r(null==d?void 0:d.trim().replace(/\(|\)/gim,"").split(","),2),h=y[0],A=y[1],x=null!==(e=o[null==p?void 0:p.trim()])&&void 0!==e?e:v(null==p?void 0:p.trim(),n,!0)(o),j=m(n,o),O=s(n,"__for_template");n.innerHTML.trim()===O&&(n.innerHTML="");var S=(null==x?void 0:x.length)-n.children.length;if(0===(null==x?void 0:x.length))n.innerHTML="";else if(0!==S)for(var k=Math.abs(S);k>0;k--)if(S<0)n.removeChild(n.lastChild);else{var N=O.startsWith("<th")?"thead":O.startsWith("<td")||O.startsWith("<tr")?"tbody":"div",_=document.createElement(N),E=O;h&&(E=E.replace(u("this\\."+h.trim()),p+"["+(x.length-k)+"]")),A&&(E=E.replace(u("this\\."+A.trim()),String(x.length-k))),_.innerHTML=E,n.appendChild(_.firstElementChild)}l||(g(j,i.deps,a,"for"),n.removeAttribute("l-for")),b(m(n,o),w,o,a.deps)}},A=function(t,e){e[t.parts[0].toUpperCase()](t)},x=function(t,n,i){void 0===i&&(i={});var a={get:function(t,e){return"object"===o(t[e])&&null!==t[e]?new Proxy(t[e],a):t[e]},set:function(a,l,u){var s,c;if("function"==typeof t[l])return!1;var f=!isNaN(Number(l))||"length"===l,v=[l];a instanceof Array&&f?v=Object.keys(t).filter((function(e){return r=t[e],n=a,r instanceof Array&&n instanceof Array&&r.length===n.length&&r.every((function(t,e){return t===n[e]}));var r,n})):Object.keys(t).some((function(t){return void 0===a[t]}))&&(v=Object.keys(t).filter((function(e){return"object"===o(t[e])}))),a[l]=u,n(v);try{for(var d=e(Object.entries(i)),p=d.next();!p.done;p=d.next()){var y=r(p.value,2),h=y[0],m=y[1];v.includes(h)&&m()}}catch(t){s={error:t}}finally{try{p&&!p.done&&(c=d.return)&&c.call(d)}finally{if(s)throw s.error}}return!0}};return new Proxy(Object.seal(t),a)},j=function(){function e(t,e,r){void 0===t&&(t={}),void 0===e&&(e={}),void 0===r&&(r={}),this.state=t,this.directives=e,this.watchers=r}return e.prototype.mount=function(e){var r=this,n="string"==typeof e?document.querySelector(e):e;return this.ast=m(n,this.state),this.directives=t(t({},this.directives),w),this.state=x(t(t({},this.state),{$render:function(t){return void 0===t&&(t=Object.keys(r.state)),r.render(t)}}),this.render.bind(this),this.watchers),this.render(),c(n,"component",this),this.state},e.prototype.directive=function(t,e){this.directives[t.toUpperCase()]=e},e.prototype.watch=function(t,e){this.watchers[t]=e},e.prototype.render=function(t){void 0===t&&(t=Object.keys(this.state)),b(this.ast,w,this.state,t)},e}(),O=function(t){return new j(t)},S=function(t){var r,i;void 0===t&&(t=document);var o="l-state",a=n(t.querySelectorAll("[l-state]")).filter((function(t){return void 0===s(t,"component")}));try{for(var l=e(a),u=l.next();!u.done;u=l.next()){var c=u.value,f=c.getAttribute(o),d=v(""+(f||"{}"),c,!0)({});O(d).mount(c)}}catch(t){r={error:t}}finally{try{u&&!u.done&&(i=l.return)&&i.call(l)}finally{if(r)throw r.error}}};export{m as compile,O as component,v as computeExpression,w as directives,S as init,x as reactive,b as render}; | ||
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,t){var r,n,i,o,a={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return o={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function l(o){return function(l){return function(o){if(r)throw new TypeError("Generator is already executing.");for(;a;)try{if(r=1,n&&(i=2&o[0]?n.return:o[0]?n.throw||((i=n.return)&&i.call(n),0):n.next)&&!(i=i.call(n,o[1])).done)return i;switch(n=0,i&&(o=[2&o[0],i.value]),o[0]){case 0:case 1:i=o;break;case 4:return a.label++,{value:o[1],done:!1};case 5:a.label++,n=o[1],o=[0];continue;case 7:o=a.ops.pop(),a.trys.pop();continue;default:if(!(i=a.trys,(i=i.length>0&&i[i.length-1])||6!==o[0]&&2!==o[0])){a=0;continue}if(3===o[0]&&(!i||o[1]>i[0]&&o[1]<i[3])){a.label=o[1];break}if(6===o[0]&&a.label<i[1]){a.label=i[1],i=o;break}if(i&&a.label<i[2]){a.label=i[2],a.ops.push(o);break}i[2]&&a.ops.pop(),a.trys.pop();continue}o=t.call(e,a)}catch(e){o=[6,e],n=0}finally{r=i=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,l])}}}function r(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 n(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 i(e,t){for(var r=0,n=t.length,i=e.length;r<n;r++,i++)e[i]=t[r];return e}var o;function a(e){return(a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}!function(e){e["@"]="on",e[":"]="bind"}(o||(o={}));var l,u=function(e){return e.replace(/\s+/gim," ").trim()};!function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(l||(l={}));var s=function(e){return new RegExp("\\b"+e+"\\b","gim")},c=function(e,t){return e[t]},f=function(e,t,r){e[t]=r},v=function(e){return i([],n(new Set(e)))},d=function(e,t,r,o){void 0===r&&(r=!0),void 0===o&&(o={});var a="with($state){"+(r?"return "+e:e)+"}";return function(r,l){try{var u=r[e];if(u)return"function"==typeof u?r[e]():u;var s={$state:r,$el:t,$emit:function(e,r,n){void 0===n&&(n=!0);var i=new CustomEvent(e,r);(n?window:t||window).dispatchEvent(i)},$event:l,$refs:o};return(new(Function.bind.apply(Function,i(i([void 0],n(Object.keys(s))),[a])))).apply(void 0,i([],n(Object.values(s))))}catch(r){console.warn('Lucia Error: "'+r+'"\n\nExpression: "'+e+'"\nElement:',t)}}},p=function(e){return e.hasAttribute("l-for")},y=function(e,t){var r=n(h(e,t),2),i=r[0],o=r[1],a=Object.keys(i).length>0,u=Object.values(i).some((function(e){var r=e.value;return Object.keys(t).some((function(e){return s(e).test(r)}))}))?l.DYNAMIC:l.STATIC;return a?{el:e,deps:o,directives:i,type:u}:void 0},h=function(e,t){var a,l;void 0===t&&(t={});var u={},p=function(){var e,t,n=document.querySelectorAll("[l-ref]"),i={};try{for(var o=r(n),a=o.next();!a.done;a=o.next()){var l=a.value,u=l.getAttribute("l-ref");u&&(i[u]=l)}}catch(t){e={error:t}}finally{try{a&&!a.done&&(t=o.return)&&t.call(o)}finally{if(e)throw e.error}}return i}(),y=[],h=function(r,a){var l="l-state"===r,h=r.startsWith("l-"),b=Object.keys(o).some((function(e){return r.startsWith(e)}));if(l||!h&&!b)return"continue";var m=[],g=Object.keys(t),w=!0,x=g.filter((function(e){var r=s(e).test(String(a));if(r&&"function"==typeof t[e]){var o=g.filter((function(r){return s(r).test(String(t[e]))}));m.push.apply(m,i([],n(o)))}return r}));/on|@/gim.test(r)&&(w=!1),r.includes("for")&&void 0===c(e,"__for_template")&&(f(e,"__for_template",String(e.innerHTML).trim()),w=!1);var A=v(i(i([],n(x)),n(m)));y.push.apply(y,i([],n(A)));var S={compute:d(a,e,w,p),deps:A,value:a},O=h?r.slice("l-".length):o[r[0]]+":"+r.slice(1);u[O.toLowerCase()]=S};try{for(var b=r(e.attributes),m=b.next();!m.done;m=b.next()){var g=m.value;h(g.name,g.value)}}catch(e){a={error:e}}finally{try{m&&!m.done&&(l=b.return)&&l.call(b)}finally{if(a)throw a.error}}return[u,v(y)]},b=function e(t,o,a){var l,u;void 0===o&&(o=!1),void 0===a&&(a=!1);var s,c=[],f=p(t),v=!!(s=t).parentElement&&s.parentElement.hasAttribute("l-for");if(!o&&(f||v))return c;if(a||o&&f||c.push(t),o||!f&&!v)try{for(var d=r(t.childNodes),y=d.next();!y.done;y=d.next()){var h=y.value;if(h.nodeType===Node.ELEMENT_NODE)if(!o&&p(h))c.push(h);else{if(h.hasAttribute("l-state"))continue;c.push.apply(c,i([],n(e(h,o))))}}}catch(e){l={error:e}}finally{try{y&&!y.done&&(u=d.return)&&u.call(d)}finally{if(l)throw l.error}}return c},m=function(e,t,n){var i,a;void 0===t&&(t={}),void 0===n&&(n=!1);var l=[],u=void 0!==c(e,"component")&&p(e),s=b(e,u,n),f="l-mask";try{for(var v=r(s),d=v.next();!d.done;d=v.next()){var h=d.value;if(h.hasAttribute(f)&&h.removeAttribute(f),new RegExp("(l-|"+Object.keys(o).join("|")+")\\w+","gim").test(h.outerHTML)){var m=y(h,t);m&&l.push(m)}}}catch(e){i={error:e}}finally{try{d&&!d.done&&(a=v.return)&&a.call(v)}finally{if(i)throw i.error}}return l},g=function(e,i,o,a){void 0===o&&(o={}),void 0===a&&(a=[]);var u,s=Object.keys(i);(u=function(){var u,c,f,v,d,p,y;return t(this,(function(h){switch(h.label){case 0:u=function(e){var u,c,f,v,d,p,y,h,b,m;return t(this,(function(g){switch(g.label){case 0:if((u=e.type===l.STATIC)&&(e.type=l.NULL),!a.some((function(t){return e.deps.includes(t)}))&&!u)return[2,"continue"];c=function(r,n){var l,c,f,v,d;return t(this,(function(t){switch(t.label){case 0:return[4];case 1:return t.sent(),l=r.split(/:|\./)[0],s.includes(l.toUpperCase())?(c=a.some((function(e){return n.deps.includes(e)})),f="l-mask"===r,v=0===Object.keys(n.deps).length,(c||u||v)&&(d={el:e.el,parts:r.split(/:|\./gim),data:n,node:e,state:o},A(d,i),(v||f)&&(delete e.directives[r],f&&e.el.removeAttribute("l-mask"))),[2]):[2,"continue"]}}))},g.label=1;case 1:g.trys.push([1,6,7,8]),b=void 0,f=r(Object.entries(e.directives)),v=f.next(),g.label=2;case 2:return v.done?[3,5]:(d=n(v.value,2),p=d[0],y=d[1],[5,c(p,y)]);case 3:g.sent(),g.label=4;case 4:return v=f.next(),[3,2];case 5:return[3,8];case 6:return h=g.sent(),b={error:h},[3,8];case 7:try{v&&!v.done&&(m=f.return)&&m.call(f)}finally{if(b)throw b.error}return[7];case 8:return[2]}}))},h.label=1;case 1:h.trys.push([1,6,7,8]),c=r(e),f=c.next(),h.label=2;case 2:return f.done?[3,5]:(v=f.value,[5,u(v)]);case 3:h.sent(),h.label=4;case 4:return f=c.next(),[3,2];case 5:return[3,8];case 6:return d=h.sent(),p={error:d},[3,8];case 7:try{f&&!f.done&&(y=c.return)&&y.call(c)}finally{if(p)throw p.error}return[7];case 8:return[2]}}))}(),function e(){var t=performance.now(),r=null;do{r=u.next()}while(performance.now()-t<25&&!r.done);r.done||setTimeout(e)})()},w=function(e,t,o,a){var l,u,s=[];try{for(var c=r(e),f=c.next();!f.done;f=c.next()){var d=f.value;s.push.apply(s,i([],n(d.deps)))}}catch(e){l={error:e}}finally{try{f&&!f.done&&(u=c.return)&&u.call(c)}finally{if(l)throw l.error}}var p=v(i(i([],n(t)),n(s)));o.deps=p,o.directives[a].deps=p},x={BIND:function(e){var t=e.el,r=e.parts,n=e.data,i=e.state;switch(r[1]){case"class":var o=n.compute(i);if("string"==typeof o)return t.setAttribute("class",u(t.className+" "+o));if(o instanceof Array)return t.setAttribute("class",u(t.className+" "+o.join(" ")));var l=[];for(var s in o)o[s]&&l.push(s);var c=new RegExp("\\b"+Object.keys(o).join("|")+"\\b","gim"),f=t.className.replace(c,"");if(l.length>0)return t.setAttribute("class",u(f+" "+l.join(" ")));if(u(f).length>0)return t.setAttribute("class",u(f));if(t.hasAttribute("class"))return t.removeAttribute("class");break;case"style":var v=n.compute(i);for(var s in t.removeAttribute("style"),v)t.style[s]=v[s];break;default:var d=n.compute(i);if("object"===a(d)&&null!==d)for(var s in d)d[s]?t.setAttribute(s,d[s]):t.removeAttribute(s);else d?t.setAttribute(r[1],d):t.removeAttribute(r[1])}},HTML:function(e){var t,r=e.el,n=e.data,i=e.state,o=e.node;o=o;var a=c(r,"component");r.innerHTML=null!==(t=n.compute(i))&&void 0!==t?t:n.value;var l=m(r,i,!0);a||w(l,n.deps,o,"html"),g(l,x,i,n.deps),f(r,"component",!0)},MODEL:function(e){var t=e.el,r=e.parts,n=e.data,i=e.state,o=t,a=i[n.value],l="checkbox"===o.type?"checked":"value";if(o[l]!==String(a)&&(o[l]=a),!c(o,"__model_registered")){o.addEventListener("debounce"===r[1]?"change":"input",(function(){return function(e,t,r,n){"checkbox"===e.type&&(e.value=String(e.checked));var i,o="number"==typeof t&&!isNaN(e.value),a="boolean"==typeof t&&("true"===e.value||"false"===e.value),l=null==t&&("null"===e.value||"undefined"===e.value);return i=o?parseFloat(e.value):a?"true"===e.value:l?"null"===e.value?null:void 0:String(e.value),n[r.value]=i,i}(o,a,n,i)})),f(o,"__model_registered",!0)}},SHOW:function(e){var t=e.el,r=e.data,n=e.state;t.style.display=r.compute(n)?"":"none",0===t.style.length&&t.removeAttribute("style")},ON:function(e){var t=e.el,n=e.parts,i=e.data,o=e.state,a={},l=n.slice(2);if(!c(t,"__on_"+n[1]+"_registered")){var u=["outside","global"].some((function(e){return String(l).includes(e)}))?window:t;a.once=l.includes("once"),a.passive=l.includes("passive"),u.addEventListener(n[1],(function(e){var n,a;if(e instanceof KeyboardEvent&&/\d/gim.test(String(l))){var u=[];try{for(var s=r(l),c=s.next();!c.done;c=s.next()){var f=c.value;isNaN(f)||u.push(Number(f))}}catch(e){n={error:e}}finally{try{c&&!c.done&&(a=s.return)&&a.call(s)}finally{if(n)throw n.error}}if(!u.includes(e.keyCode))return}if(l.includes("prevent")&&e.preventDefault(),l.includes("stop")&&e.stopPropagation(),!l.includes("self")||e.target===t){if(l.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}i.compute(o,e)}}),a),f(t,"__on_"+n[1]+"_registered",!0)}},TEXT:function(e){var t,r=e.el,n=e.data,i=e.state;r.textContent=null!==(t=n.compute(i))&&void 0!==t?t:n.value},FOR:function(e){var t,r=e.el,i=e.data,o=e.state,a=e.node;a=a;var l=c(r,"component");f(r,"component",!0);var u=n(i.value.split(/\s+(?:in|of)\s+/gim),2),v=u[0],p=u[1],y=n(null==v?void 0:v.trim().replace(/\(|\)/gim,"").split(","),2),h=y[0],b=y[1],A=null!==(t=o[null==p?void 0:p.trim()])&&void 0!==t?t:d(null==p?void 0:p.trim(),r,!0)(o),S=m(r,o),O=c(r,"__for_template");r.innerHTML.trim()===O&&(r.innerHTML="");var j=(null==A?void 0:A.length)-r.children.length;if(0===(null==A?void 0:A.length))r.innerHTML="";else if(0!==j)for(var k=Math.abs(j);k>0;--k)if(j<0)r.removeChild(r.lastChild);else{var N=O.startsWith("<th")?"thead":O.startsWith("<td")||O.startsWith("<tr")?"tbody":"div",_=document.createElement(N),E=O;h&&(E=E.replace(s("this\\."+h.trim()),p+"["+(A.length-k)+"]")),b&&(E=E.replace(s("this\\."+b.trim()),String(A.length-k))),_.innerHTML=E,r.appendChild(_.firstElementChild)}l||(w(S,i.deps,a,"for"),r.removeAttribute("l-for")),g(m(r,o,!0),x,o,a.deps)}},A=function(e,t){t[e.parts[0].toUpperCase()](e)},S=function(e,t,o){void 0===o&&(o={});var l={get:function(e,t){return"object"===a(e[t])&&null!==e[t]?new Proxy(e[t],l):e[t]},set:function(l,u,s){var c,f;if("function"==typeof e[u]||u.startsWith("$"))return!1;var v=!isNaN(Number(u))||"length"===u,d=[u];l instanceof Array&&v?d.push.apply(d,i([],n(Object.keys(e).filter((function(t){return e[t]instanceof Array&&(r=e[t],n=l,r instanceof Array&&n instanceof Array&&r.length===n.length&&r.every((function(e,t){return e===n[t]})));var r,n}))))):Object.is(l,e)||d.push.apply(d,i([],n(Object.keys(e).filter((function(t){return"object"===a(e[t])&&JSON.stringify(e[t]).indexOf(u)>-1}))))),l[u]=s,t(d);try{for(var p=r(Object.entries(o)),y=p.next();!y.done;y=p.next()){var h=n(y.value,2),b=h[0],m=h[1];d.includes(b)&&m()}}catch(e){c={error:e}}finally{try{y&&!y.done&&(f=p.return)&&f.call(p)}finally{if(c)throw c.error}}return!0}};return new Proxy(Object.seal(e),l)},O=function(){function t(e,t,r){void 0===e&&(e={}),void 0===t&&(t={}),void 0===r&&(r={}),this.state=e,this.directives=t,this.watchers=r}return t.prototype.mount=function(t){var r=this,n="string"==typeof t?document.querySelector(t):t;return this.ast=m(n,this.state),this.directives=e(e({},this.directives),x),this.state=S(e(e({},this.state),{$render:function(e){return void 0===e&&(e=Object.keys(r.state)),r.render(e)}}),this.render.bind(this),this.watchers),this.render(),f(n,"component",this),this.handleMutations(n),this.state},t.prototype.directive=function(e,t){this.directives[e.toUpperCase()]=t},t.prototype.watch=function(e,t){this.watchers[e]=t},t.prototype.render=function(e){void 0===e&&(e=Object.keys(this.state)),g(this.ast,x,this.state,e)},t.prototype.handleMutations=function(e){var t=this;new MutationObserver((function(n){var i,o;try{for(var a=r(n),l=a.next();!l.done;l=a.next()){var u=l.value,s=String(u.attributeName);"attributes"===u.type&&s.startsWith("l-")&&"l-for"!==s&&(t.ast=m(e,t.state),t.render(),console.log("render"))}}catch(e){i={error:e}}finally{try{l&&!l.done&&(o=a.return)&&o.call(a)}finally{if(i)throw i.error}}})).observe(e,{attributes:!0,subtree:!0})},t}(),j=function(e){return new O(e)},k=function(e){var t,o;void 0===e&&(e=document);var a="l-state",l=i([],n(e.querySelectorAll("[l-state]"))).filter((function(e){return void 0===c(e,"component")}));try{for(var u=r(l),s=u.next();!s.done;s=u.next()){var f=s.value,v=f.getAttribute(a),p=d(""+(v||"{}"),f,!0)({});j(p).mount(f)}}catch(e){t={error:e}}finally{try{s&&!s.done&&(o=u.return)&&o.call(u)}finally{if(t)throw t.error}}};export{m as compile,j as component,d as computeExpression,x as directives,k as init,S as reactive,g as render}; |
@@ -30,2 +30,30 @@ var Lucia = (function () { | ||
function __generator(thisArg, body) { | ||
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; | ||
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; | ||
function verb(n) { return function (v) { return step([n, v]); }; } | ||
function step(op) { | ||
if (f) throw new TypeError("Generator is already executing."); | ||
while (_) try { | ||
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; | ||
if (y = 0, t) op = [op[0] & 2, t.value]; | ||
switch (op[0]) { | ||
case 0: case 1: t = op; break; | ||
case 4: _.label++; return { value: op[1], done: false }; | ||
case 5: _.label++; y = op[1]; op = [0]; continue; | ||
case 7: op = _.ops.pop(); _.trys.pop(); continue; | ||
default: | ||
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } | ||
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } | ||
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } | ||
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } | ||
if (t[2]) _.ops.pop(); | ||
_.trys.pop(); continue; | ||
} | ||
op = body.call(thisArg, _); | ||
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } | ||
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; | ||
} | ||
} | ||
function __values(o) { | ||
@@ -60,7 +88,6 @@ var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; | ||
/** @deprecated */ | ||
function __spread() { | ||
for (var ar = [], i = 0; i < arguments.length; i++) | ||
ar = ar.concat(__read(arguments[i])); | ||
return ar; | ||
function __spreadArray(to, from) { | ||
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++) | ||
to[j] = from[i]; | ||
return to; | ||
} | ||
@@ -193,3 +220,3 @@ | ||
var removeDupesFromArray = function removeDupesFromArray(array) { | ||
return __spread(new Set(array)); | ||
return __spreadArray([], __read(new Set(array))); | ||
}; | ||
@@ -231,3 +258,3 @@ | ||
}; | ||
return new (Function.bind.apply(Function, __spread([void 0], Object.keys(specialProperties), [formattedExpression])))().apply(void 0, __spread(Object.values(specialProperties))); | ||
return new (Function.bind.apply(Function, __spreadArray(__spreadArray([void 0], __read(Object.keys(specialProperties))), [formattedExpression])))().apply(void 0, __spreadArray([], __read(Object.values(specialProperties)))); | ||
} | ||
@@ -322,3 +349,3 @@ } catch (err) { | ||
}); | ||
depsInFunctions.push.apply(depsInFunctions, __spread(depsInFunction)); | ||
depsInFunctions.push.apply(depsInFunctions, __spreadArray([], __read(depsInFunction))); | ||
} | ||
@@ -335,4 +362,4 @@ | ||
var uniqueCompiledDeps = removeDupesFromArray(__spread(deps, depsInFunctions)); | ||
nodeDeps.push.apply(nodeDeps, __spread(uniqueCompiledDeps)); | ||
var uniqueCompiledDeps = removeDupesFromArray(__spreadArray(__spreadArray([], __read(deps)), __read(depsInFunctions))); | ||
nodeDeps.push.apply(nodeDeps, __spreadArray([], __read(uniqueCompiledDeps))); | ||
var directiveData = { | ||
@@ -396,3 +423,3 @@ compute: computeExpression(value, el, returnable, refs), | ||
if (childNode.hasAttribute(DIRECTIVE_PREFIX + "state")) continue; | ||
collection.push.apply(collection, __spread(flattenNodeChildren(childNode, isListGroup))); | ||
collection.push.apply(collection, __spreadArray([], __read(flattenNodeChildren(childNode, isListGroup)))); | ||
} | ||
@@ -460,2 +487,17 @@ } | ||
var concurrent = function concurrent(generatorFunction) { | ||
var generator = generatorFunction(); | ||
return function next() { | ||
var start = performance.now(); | ||
var task = null; | ||
do { | ||
task = generator.next(); | ||
} while (performance.now() - start < 25 && !task.done); | ||
if (task.done) return; | ||
setTimeout(next); | ||
}; | ||
}; | ||
var render = function render(ast, directives, state, changedProps) { | ||
@@ -470,70 +512,161 @@ if (state === void 0) { | ||
if (typeof changedProps === 'string') changedProps = [changedProps]; | ||
var legalDirectiveNames = Object.keys(directives); | ||
concurrent(function () { | ||
var _loop_1, ast_1, ast_1_1, node, e_1_1; | ||
var _loop_1 = function _loop_1(i) { | ||
var e_1, _a; | ||
var node = ast[i]; | ||
if (node.type === ASTNodeType.NULL) return "continue"; | ||
var isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) node.type = ASTNodeType.NULL; | ||
var nodeHasDep = changedProps.some(function (prop) { | ||
return node.deps.includes(prop); | ||
}); | ||
if (!nodeHasDep && !isStatic) return "continue"; | ||
return __generator(this, function (_b) { | ||
switch (_b.label) { | ||
case 0: | ||
_loop_1 = function _loop_1(node) { | ||
var isStatic, nodeHasDep, _loop_2, _c, _d, _e, directiveName, directiveData, e_2_1; | ||
var _loop_2 = function _loop_2(directiveName, directiveData) { | ||
var rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) return "continue"; | ||
var directiveHasDep = changedProps.some(function (prop) { | ||
return directiveData.deps.includes(prop); | ||
}); | ||
var isMaskDirective = directiveName === DIRECTIVE_PREFIX + "mask"; | ||
var isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
var e_2, _f; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
var directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node: node, | ||
state: state | ||
}; | ||
renderDirective(directiveProps, directives); | ||
return __generator(this, function (_g) { | ||
switch (_g.label) { | ||
case 0: | ||
isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) node.type = ASTNodeType.NULL; | ||
nodeHasDep = changedProps.some(function (prop) { | ||
return node.deps.includes(prop); | ||
}); | ||
if (!nodeHasDep && !isStatic) return [2, "continue"]; | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
_loop_2 = function _loop_2(directiveName, directiveData) { | ||
var rawDirectiveName, directiveHasDep, isMaskDirective, isStaticDirective, directiveProps; | ||
return __generator(this, function (_h) { | ||
switch (_h.label) { | ||
case 0: | ||
return [4]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(DIRECTIVE_PREFIX + "mask"); | ||
case 1: | ||
_h.sent(); | ||
rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) return [2, "continue"]; | ||
directiveHasDep = changedProps.some(function (prop) { | ||
return directiveData.deps.includes(prop); | ||
}); | ||
isMaskDirective = directiveName === DIRECTIVE_PREFIX + "mask"; | ||
isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node: node, | ||
state: state | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(DIRECTIVE_PREFIX + "mask"); | ||
} | ||
} | ||
} | ||
return [2]; | ||
} | ||
}); | ||
}; | ||
_g.label = 1; | ||
case 1: | ||
_g.trys.push([1, 6, 7, 8]); | ||
_c = (e_2 = void 0, __values(Object.entries(node.directives))), _d = _c.next(); | ||
_g.label = 2; | ||
case 2: | ||
if (!!_d.done) return [3, 5]; | ||
_e = __read(_d.value, 2), directiveName = _e[0], directiveData = _e[1]; | ||
return [5, _loop_2(directiveName, directiveData)]; | ||
case 3: | ||
_g.sent(); | ||
_g.label = 4; | ||
case 4: | ||
_d = _c.next(); | ||
return [3, 2]; | ||
case 5: | ||
return [3, 8]; | ||
case 6: | ||
e_2_1 = _g.sent(); | ||
e_2 = { | ||
error: e_2_1 | ||
}; | ||
return [3, 8]; | ||
case 7: | ||
try { | ||
if (_d && !_d.done && (_f = _c["return"])) _f.call(_c); | ||
} finally { | ||
if (e_2) throw e_2.error; | ||
} | ||
return [7]; | ||
case 8: | ||
return [2]; | ||
} | ||
}); | ||
}; | ||
_b.label = 1; | ||
case 1: | ||
_b.trys.push([1, 6, 7, 8]); | ||
ast_1 = __values(ast), ast_1_1 = ast_1.next(); | ||
_b.label = 2; | ||
case 2: | ||
if (!!ast_1_1.done) return [3, 5]; | ||
node = ast_1_1.value; | ||
return [5, _loop_1(node)]; | ||
case 3: | ||
_b.sent(); | ||
_b.label = 4; | ||
case 4: | ||
ast_1_1 = ast_1.next(); | ||
return [3, 2]; | ||
case 5: | ||
return [3, 8]; | ||
case 6: | ||
e_1_1 = _b.sent(); | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
return [3, 8]; | ||
case 7: | ||
try { | ||
if (ast_1_1 && !ast_1_1.done && (_a = ast_1["return"])) _a.call(ast_1); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
} | ||
}; | ||
try { | ||
for (var _b = (e_1 = void 0, __values(Object.entries(node.directives))), _c = _b.next(); !_c.done; _c = _b.next()) { | ||
var _d = __read(_c.value, 2), | ||
directiveName = _d[0], | ||
directiveData = _d[1]; | ||
return [7]; | ||
_loop_2(directiveName, directiveData); | ||
case 8: | ||
return [2]; | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (_c && !_c.done && (_a = _b["return"])) _a.call(_b); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
}; | ||
for (var i = 0; i < ast.length; i++) { | ||
_loop_1(i); | ||
} | ||
}); | ||
})(); | ||
}; | ||
@@ -549,3 +682,3 @@ | ||
var childNode = ast_1_1.value; | ||
deps.push.apply(deps, __spread(childNode.deps)); | ||
deps.push.apply(deps, __spreadArray([], __read(childNode.deps))); | ||
} | ||
@@ -564,3 +697,3 @@ } catch (e_1_1) { | ||
var cleanedDeps = removeDupesFromArray(__spread(currentDeps, deps)); | ||
var cleanedDeps = removeDupesFromArray(__spreadArray(__spreadArray([], __read(currentDeps)), __read(deps))); | ||
node.deps = cleanedDeps; | ||
@@ -737,3 +870,3 @@ node.directives[directiveName].deps = cleanedDeps; | ||
if ((currArray === null || currArray === void 0 ? void 0 : currArray.length) === 0) el.innerHTML = '';else if (arrayDiff !== 0) { | ||
for (var i = Math.abs(arrayDiff); i > 0; i--) { | ||
for (var i = Math.abs(arrayDiff); i > 0; --i) { | ||
if (arrayDiff < 0) el.removeChild(el.lastChild);else { | ||
@@ -763,3 +896,3 @@ var tag = template.startsWith('<th') ? 'thead' : template.startsWith('<td') || template.startsWith('<tr') ? 'tbody' : 'div'; | ||
render(compile(el, state), directives, state, node.deps); | ||
render(compile(el, state, true), directives, state, node.deps); | ||
}; | ||
@@ -801,3 +934,3 @@ | ||
if (typeof state[key] === 'function') return false; | ||
if (typeof state[key] === 'function' || key.startsWith('$')) return false; | ||
var hasArrayMutationKey = !isNaN(Number(key)) || key === 'length'; | ||
@@ -807,12 +940,10 @@ var props = [key]; | ||
if (target instanceof Array && hasArrayMutationKey) { | ||
props = Object.keys(state).filter(function (prop) { | ||
return arrayEquals(state[prop], target); | ||
}); | ||
props.push.apply(props, __spreadArray([], __read(Object.keys(state).filter(function (prop) { | ||
return state[prop] instanceof Array && arrayEquals(state[prop], target); | ||
})))); | ||
} else { | ||
if (Object.keys(state).some(function (prop) { | ||
return target[prop] === undefined; | ||
})) { | ||
props = Object.keys(state).filter(function (prop) { | ||
return _typeof(state[prop]) === 'object'; | ||
}); | ||
if (!Object.is(target, state)) { | ||
props.push.apply(props, __spreadArray([], __read(Object.keys(state).filter(function (prop) { | ||
return _typeof(state[prop]) === 'object' && JSON.stringify(state[prop]).indexOf(key) > -1; | ||
})))); | ||
} | ||
@@ -889,2 +1020,3 @@ } | ||
setElementCustomProp(rootEl, 'component', this); | ||
this.handleMutations(rootEl); | ||
return this.state; | ||
@@ -909,2 +1041,39 @@ }; | ||
Component.prototype.handleMutations = function (el) { | ||
var _this = this; | ||
var mutationObserver = new MutationObserver(function (mutationsList) { | ||
var e_1, _a; | ||
try { | ||
for (var mutationsList_1 = __values(mutationsList), mutationsList_1_1 = mutationsList_1.next(); !mutationsList_1_1.done; mutationsList_1_1 = mutationsList_1.next()) { | ||
var mutation = mutationsList_1_1.value; | ||
var attrName = String(mutation.attributeName); | ||
if (mutation.type === 'attributes' && attrName.startsWith(DIRECTIVE_PREFIX) && attrName !== DIRECTIVE_PREFIX + "for") { | ||
_this.ast = compile(el, _this.state); | ||
_this.render(); | ||
console.log('render'); | ||
} | ||
} | ||
} catch (e_1_1) { | ||
e_1 = { | ||
error: e_1_1 | ||
}; | ||
} finally { | ||
try { | ||
if (mutationsList_1_1 && !mutationsList_1_1.done && (_a = mutationsList_1["return"])) _a.call(mutationsList_1); | ||
} finally { | ||
if (e_1) throw e_1.error; | ||
} | ||
} | ||
}); | ||
mutationObserver.observe(el, { | ||
attributes: true, | ||
subtree: true | ||
}); | ||
}; | ||
return Component; | ||
@@ -926,3 +1095,3 @@ }(); | ||
var uninitializedComponents = __spread(componentElements).filter(function (el) { | ||
var uninitializedComponents = __spreadArray([], __read(componentElements)).filter(function (el) { | ||
return getElementCustomProp(el, 'component') === undefined; | ||
@@ -965,6 +1134,6 @@ }); | ||
document.addEventListener('DOMContentLoaded', function () { | ||
var customLuciaInit = window.customLuciaInit; | ||
var init$1 = window.LuciaInit; | ||
if (customLuciaInit) { | ||
customLuciaInit(init); | ||
if (init$1) { | ||
init$1(init); | ||
} else { | ||
@@ -971,0 +1140,0 @@ init(); |
@@ -1,1 +0,1 @@ | ||
var Lucia=function(){"use strict";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="l-";function a(t){return(a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}!function(t){t["@"]="on",t[":"]="bind"}(i||(i={}));var u,l=function(t){return t.replace(/\s+/gim," ").trim()};!function(t){t[t.NULL=-1]="NULL",t[t.STATIC=0]="STATIC",t[t.DYNAMIC=1]="DYNAMIC"}(u||(u={}));var s=function(t){return new RegExp("\\b"+t+"\\b","gim")},c=function(t,e){return t[e]},f=function(t,e,r){t[e]=r},v=function(t){return n(new Set(t))},d=function(t,e,r,i){void 0===r&&(r=!0),void 0===i&&(i={});var o="with($state){"+(r?"return "+t:t)+"}";return function(r,a){try{var u=r[t];if(u)return"function"==typeof u?r[t]():u;var l={$state:r,$el:e,$emit:function(t,r,n){void 0===n&&(n=!0);var i=new CustomEvent(t,r);(n?window:e||window).dispatchEvent(i)},$event:a,$refs:i};return(new(Function.bind.apply(Function,n([void 0],Object.keys(l),[o])))).apply(void 0,n(Object.values(l)))}catch(r){console.warn('Lucia Error: "'+r+'"\n\nExpression: "'+t+'"\nElement:',e)}}},p=function(t){return t.hasAttribute("l-for")},y=function(t,e){var n=r(h(t,e),2),i=n[0],o=n[1],a=Object.keys(i).length>0,l=Object.values(i).some((function(t){var r=t.value;return Object.keys(e).some((function(t){return s(t).test(r)}))}))?u.DYNAMIC:u.STATIC;return a?{el:t,deps:o,directives:i,type:l}:void 0},h=function(t,r){var a,u;void 0===r&&(r={});var l={},p=function(){var t,r,n=document.querySelectorAll("[l-ref]"),i={};try{for(var o=e(n),a=o.next();!a.done;a=o.next()){var u=a.value,l=u.getAttribute("l-ref");l&&(i[l]=u)}}catch(e){t={error:e}}finally{try{a&&!a.done&&(r=o.return)&&r.call(o)}finally{if(t)throw t.error}}return i}(),y=[],h=function(e,a){var u="l-state"===e,h=e.startsWith(o),m=Object.keys(i).some((function(t){return e.startsWith(t)}));if(u||!h&&!m)return"continue";var b=[],g=Object.keys(r),w=!0,A=g.filter((function(t){var e=s(t).test(String(a));if(e&&"function"==typeof r[t]){var i=g.filter((function(e){return s(e).test(String(r[t]))}));b.push.apply(b,n(i))}return e}));/on|@/gim.test(e)&&(w=!1),e.includes("for")&&void 0===c(t,"__for_template")&&(f(t,"__for_template",String(t.innerHTML).trim()),w=!1);var j=v(n(A,b));y.push.apply(y,n(j));var x={compute:d(a,t,w,p),deps:j,value:a},O=h?e.slice(o.length):i[e[0]]+":"+e.slice(1);l[O.toLowerCase()]=x};try{for(var m=e(t.attributes),b=m.next();!b.done;b=m.next()){var g=b.value;h(g.name,g.value)}}catch(t){a={error:t}}finally{try{b&&!b.done&&(u=m.return)&&u.call(m)}finally{if(a)throw a.error}}return[l,v(y)]},m=function t(r,i,o){var a,u;void 0===i&&(i=!1),void 0===o&&(o=!1);var l,s=[],c=p(r),f=!!(l=r).parentElement&&l.parentElement.hasAttribute("l-for");if(!i&&(c||f))return s;if(o||i&&c||s.push(r),i||!c&&!f)try{for(var v=e(r.childNodes),d=v.next();!d.done;d=v.next()){var y=d.value;if(y.nodeType===Node.ELEMENT_NODE)if(!i&&p(y))s.push(y);else{if(y.hasAttribute("l-state"))continue;s.push.apply(s,n(t(y,i)))}}}catch(t){a={error:t}}finally{try{d&&!d.done&&(u=v.return)&&u.call(v)}finally{if(a)throw a.error}}return s},b=function(t,r,n){var o,a;void 0===r&&(r={}),void 0===n&&(n=!1);var u=[],l=void 0!==c(t,"component")&&p(t),s=m(t,l,n),f="l-mask";try{for(var v=e(s),d=v.next();!d.done;d=v.next()){var h=d.value;if(h.hasAttribute(f)&&h.removeAttribute(f),new RegExp("(l-|"+Object.keys(i).join("|")+")\\w+","gim").test(h.outerHTML)){var b=y(h,r);b&&u.push(b)}}}catch(t){o={error:t}}finally{try{d&&!d.done&&(a=v.return)&&a.call(v)}finally{if(o)throw o.error}}return u},g=function(t,n,i,o){void 0===i&&(i={}),void 0===o&&(o=[]),"string"==typeof o&&(o=[o]);for(var a=Object.keys(n),l=function(l){var s,c,f=t[l];if(f.type===u.NULL)return"continue";var v=f.type===u.STATIC;if(v&&(f.type=u.NULL),!o.some((function(t){return f.deps.includes(t)}))&&!v)return"continue";var d=function(t,e){var r=t.split(/:|\./)[0];if(!a.includes(r.toUpperCase()))return"continue";var u=o.some((function(t){return e.deps.includes(t)})),l="l-mask"===t,s=0===Object.keys(e.deps).length;if(u||v||s){var c={el:f.el,parts:t.split(/:|\./gim),data:e,node:f,state:i};j(c,n),(s||l)&&(delete f.directives[t],l&&f.el.removeAttribute("l-mask"))}};try{for(var p=(s=void 0,e(Object.entries(f.directives))),y=p.next();!y.done;y=p.next()){var h=r(y.value,2);d(h[0],h[1])}}catch(t){s={error:t}}finally{try{y&&!y.done&&(c=p.return)&&c.call(p)}finally{if(s)throw s.error}}},s=0;s<t.length;s++)l(s)},w=function(t,r,i,o){var a,u,l=[];try{for(var s=e(t),c=s.next();!c.done;c=s.next()){var f=c.value;l.push.apply(l,n(f.deps))}}catch(t){a={error:t}}finally{try{c&&!c.done&&(u=s.return)&&u.call(s)}finally{if(a)throw a.error}}var d=v(n(r,l));i.deps=d,i.directives[o].deps=d},A={BIND:function(t){var e=t.el,r=t.parts,n=t.data,i=t.state;switch(r[1]){case"class":var o=n.compute(i);if("string"==typeof o)return e.setAttribute("class",l(e.className+" "+o));if(o instanceof Array)return e.setAttribute("class",l(e.className+" "+o.join(" ")));var u=[];for(var s in o)o[s]&&u.push(s);var c=new RegExp("\\b"+Object.keys(o).join("|")+"\\b","gim"),f=e.className.replace(c,"");if(u.length>0)return e.setAttribute("class",l(f+" "+u.join(" ")));if(l(f).length>0)return e.setAttribute("class",l(f));if(e.hasAttribute("class"))return e.removeAttribute("class");break;case"style":var v=n.compute(i);for(var s in e.removeAttribute("style"),v)e.style[s]=v[s];break;default:var d=n.compute(i);if("object"===a(d)&&null!==d)for(var s in d)d[s]?e.setAttribute(s,d[s]):e.removeAttribute(s);else d?e.setAttribute(r[1],d):e.removeAttribute(r[1])}},HTML:function(t){var e,r=t.el,n=t.data,i=t.state,o=t.node;o=o;var a=c(r,"component");r.innerHTML=null!==(e=n.compute(i))&&void 0!==e?e:n.value;var u=b(r,i,!0);a||w(u,n.deps,o,"html"),g(u,A,i,n.deps),f(r,"component",!0)},MODEL:function(t){var e=t.el,r=t.parts,n=t.data,i=t.state,o=e,a=i[n.value],u="checkbox"===o.type?"checked":"value";if(o[u]!==String(a)&&(o[u]=a),!c(o,"__model_registered")){o.addEventListener("debounce"===r[1]?"change":"input",(function(){return function(t,e,r,n){"checkbox"===t.type&&(t.value=String(t.checked));var i,o="number"==typeof e&&!isNaN(t.value),a="boolean"==typeof e&&("true"===t.value||"false"===t.value),u=null==e&&("null"===t.value||"undefined"===t.value);return i=o?parseFloat(t.value):a?"true"===t.value:u?"null"===t.value?null:void 0:String(t.value),n[r.value]=i,i}(o,a,n,i)})),f(o,"__model_registered",!0)}},SHOW:function(t){var e=t.el,r=t.data,n=t.state;e.style.display=r.compute(n)?"":"none",0===e.style.length&&e.removeAttribute("style")},ON:function(t){var r=t.el,n=t.parts,i=t.data,o=t.state,a={},u=n.slice(2);if(!c(r,"__on_"+n[1]+"_registered")){var l=["outside","global"].some((function(t){return String(u).includes(t)}))?window:r;a.once=u.includes("once"),a.passive=u.includes("passive"),l.addEventListener(n[1],(function(t){var n,a;if(t instanceof KeyboardEvent&&/\d/gim.test(String(u))){var l=[];try{for(var s=e(u),c=s.next();!c.done;c=s.next()){var f=c.value;isNaN(f)||l.push(Number(f))}}catch(t){n={error:t}}finally{try{c&&!c.done&&(a=s.return)&&a.call(s)}finally{if(n)throw n.error}}if(!l.includes(t.keyCode))return}if(u.includes("prevent")&&t.preventDefault(),u.includes("stop")&&t.stopPropagation(),!u.includes("self")||t.target===r){if(u.includes("outside")){if(r.contains(t.target))return;if(r.offsetWidth<1&&r.offsetHeight<1)return}i.compute(o,t)}}),a),f(r,"__on_"+n[1]+"_registered",!0)}},TEXT:function(t){var e,r=t.el,n=t.data,i=t.state;r.textContent=null!==(e=n.compute(i))&&void 0!==e?e:n.value},FOR:function(t){var e,n=t.el,i=t.data,o=t.state,a=t.node;a=a;var u=c(n,"component");f(n,"component",!0);var l=r(i.value.split(/\s+(?:in|of)\s+/gim),2),v=l[0],p=l[1],y=r(null==v?void 0:v.trim().replace(/\(|\)/gim,"").split(","),2),h=y[0],m=y[1],j=null!==(e=o[null==p?void 0:p.trim()])&&void 0!==e?e:d(null==p?void 0:p.trim(),n,!0)(o),x=b(n,o),O=c(n,"__for_template");n.innerHTML.trim()===O&&(n.innerHTML="");var S=(null==j?void 0:j.length)-n.children.length;if(0===(null==j?void 0:j.length))n.innerHTML="";else if(0!==S)for(var _=Math.abs(S);_>0;_--)if(S<0)n.removeChild(n.lastChild);else{var L=O.startsWith("<th")?"thead":O.startsWith("<td")||O.startsWith("<tr")?"tbody":"div",k=document.createElement(L),E=O;h&&(E=E.replace(s("this\\."+h.trim()),p+"["+(j.length-_)+"]")),m&&(E=E.replace(s("this\\."+m.trim()),String(j.length-_))),k.innerHTML=E,n.appendChild(k.firstElementChild)}u||(w(x,i.deps,a,"for"),n.removeAttribute("l-for")),g(b(n,o),A,o,a.deps)}},j=function(t,e){e[t.parts[0].toUpperCase()](t)},x=function(t,n,i){void 0===i&&(i={});var o={get:function(t,e){return"object"===a(t[e])&&null!==t[e]?new Proxy(t[e],o):t[e]},set:function(o,u,l){var s,c;if("function"==typeof t[u])return!1;var f=!isNaN(Number(u))||"length"===u,v=[u];o instanceof Array&&f?v=Object.keys(t).filter((function(e){return r=t[e],n=o,r instanceof Array&&n instanceof Array&&r.length===n.length&&r.every((function(t,e){return t===n[e]}));var r,n})):Object.keys(t).some((function(t){return void 0===o[t]}))&&(v=Object.keys(t).filter((function(e){return"object"===a(t[e])}))),o[u]=l,n(v);try{for(var d=e(Object.entries(i)),p=d.next();!p.done;p=d.next()){var y=r(p.value,2),h=y[0],m=y[1];v.includes(h)&&m()}}catch(t){s={error:t}}finally{try{p&&!p.done&&(c=d.return)&&c.call(d)}finally{if(s)throw s.error}}return!0}};return new Proxy(Object.seal(t),o)},O=function(){function e(t,e,r){void 0===t&&(t={}),void 0===e&&(e={}),void 0===r&&(r={}),this.state=t,this.directives=e,this.watchers=r}return e.prototype.mount=function(e){var r=this,n="string"==typeof e?document.querySelector(e):e;return this.ast=b(n,this.state),this.directives=t(t({},this.directives),A),this.state=x(t(t({},this.state),{$render:function(t){return void 0===t&&(t=Object.keys(r.state)),r.render(t)}}),this.render.bind(this),this.watchers),this.render(),f(n,"component",this),this.state},e.prototype.directive=function(t,e){this.directives[t.toUpperCase()]=e},e.prototype.watch=function(t,e){this.watchers[t]=e},e.prototype.render=function(t){void 0===t&&(t=Object.keys(this.state)),g(this.ast,A,this.state,t)},e}(),S=function(t){return new O(t)},_=function(t){var r,i;void 0===t&&(t=document);var o="l-state",a=n(t.querySelectorAll("[l-state]")).filter((function(t){return void 0===c(t,"component")}));try{for(var u=e(a),l=u.next();!l.done;l=u.next()){var s=l.value,f=s.getAttribute(o),v=d(""+(f||"{}"),s,!0)({});S(v).mount(s)}}catch(t){r={error:t}}finally{try{l&&!l.done&&(i=u.return)&&i.call(u)}finally{if(r)throw r.error}}},L=Object.freeze({__proto__:null,component:S,compile:b,render:g,reactive:x,directives:A,computeExpression:d,init:_});return"loading"===document.readyState&&document.addEventListener("DOMContentLoaded",(function(){var t=window.customLuciaInit;t?t(_):_()})),L}(); | ||
var Lucia=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,t){var r,n,i,o,a={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return o={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function l(o){return function(l){return function(o){if(r)throw new TypeError("Generator is already executing.");for(;a;)try{if(r=1,n&&(i=2&o[0]?n.return:o[0]?n.throw||((i=n.return)&&i.call(n),0):n.next)&&!(i=i.call(n,o[1])).done)return i;switch(n=0,i&&(o=[2&o[0],i.value]),o[0]){case 0:case 1:i=o;break;case 4:return a.label++,{value:o[1],done:!1};case 5:a.label++,n=o[1],o=[0];continue;case 7:o=a.ops.pop(),a.trys.pop();continue;default:if(!(i=a.trys,(i=i.length>0&&i[i.length-1])||6!==o[0]&&2!==o[0])){a=0;continue}if(3===o[0]&&(!i||o[1]>i[0]&&o[1]<i[3])){a.label=o[1];break}if(6===o[0]&&a.label<i[1]){a.label=i[1],i=o;break}if(i&&a.label<i[2]){a.label=i[2],a.ops.push(o);break}i[2]&&a.ops.pop(),a.trys.pop();continue}o=t.call(e,a)}catch(e){o=[6,e],n=0}finally{r=i=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,l])}}}function r(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 n(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 i(e,t){for(var r=0,n=t.length,i=e.length;r<n;r++,i++)e[i]=t[r];return e}var o,a="l-";function l(e){return(l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}!function(e){e["@"]="on",e[":"]="bind"}(o||(o={}));var u,s=function(e){return e.replace(/\s+/gim," ").trim()};!function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(u||(u={}));var c=function(e){return new RegExp("\\b"+e+"\\b","gim")},f=function(e,t){return e[t]},v=function(e,t,r){e[t]=r},d=function(e){return i([],n(new Set(e)))},p=function(e,t,r,o){void 0===r&&(r=!0),void 0===o&&(o={});var a="with($state){"+(r?"return "+e:e)+"}";return function(r,l){try{var u=r[e];if(u)return"function"==typeof u?r[e]():u;var s={$state:r,$el:t,$emit:function(e,r,n){void 0===n&&(n=!0);var i=new CustomEvent(e,r);(n?window:t||window).dispatchEvent(i)},$event:l,$refs:o};return(new(Function.bind.apply(Function,i(i([void 0],n(Object.keys(s))),[a])))).apply(void 0,i([],n(Object.values(s))))}catch(r){console.warn('Lucia Error: "'+r+'"\n\nExpression: "'+e+'"\nElement:',t)}}},y=function(e){return e.hasAttribute("l-for")},h=function(e,t){var r=n(b(e,t),2),i=r[0],o=r[1],a=Object.keys(i).length>0,l=Object.values(i).some((function(e){var r=e.value;return Object.keys(t).some((function(e){return c(e).test(r)}))}))?u.DYNAMIC:u.STATIC;return a?{el:e,deps:o,directives:i,type:l}:void 0},b=function(e,t){var l,u;void 0===t&&(t={});var s={},y=function(){var e,t,n=document.querySelectorAll("[l-ref]"),i={};try{for(var o=r(n),a=o.next();!a.done;a=o.next()){var l=a.value,u=l.getAttribute("l-ref");u&&(i[u]=l)}}catch(t){e={error:t}}finally{try{a&&!a.done&&(t=o.return)&&t.call(o)}finally{if(e)throw e.error}}return i}(),h=[],b=function(r,l){var u="l-state"===r,b=r.startsWith(a),m=Object.keys(o).some((function(e){return r.startsWith(e)}));if(u||!b&&!m)return"continue";var g=[],w=Object.keys(t),x=!0,A=w.filter((function(e){var r=c(e).test(String(l));if(r&&"function"==typeof t[e]){var o=w.filter((function(r){return c(r).test(String(t[e]))}));g.push.apply(g,i([],n(o)))}return r}));/on|@/gim.test(r)&&(x=!1),r.includes("for")&&void 0===f(e,"__for_template")&&(v(e,"__for_template",String(e.innerHTML).trim()),x=!1);var O=d(i(i([],n(A)),n(g)));h.push.apply(h,i([],n(O)));var S={compute:p(l,e,x,y),deps:O,value:l},j=b?r.slice(a.length):o[r[0]]+":"+r.slice(1);s[j.toLowerCase()]=S};try{for(var m=r(e.attributes),g=m.next();!g.done;g=m.next()){var w=g.value;b(w.name,w.value)}}catch(e){l={error:e}}finally{try{g&&!g.done&&(u=m.return)&&u.call(m)}finally{if(l)throw l.error}}return[s,d(h)]},m=function e(t,o,a){var l,u;void 0===o&&(o=!1),void 0===a&&(a=!1);var s,c=[],f=y(t),v=!!(s=t).parentElement&&s.parentElement.hasAttribute("l-for");if(!o&&(f||v))return c;if(a||o&&f||c.push(t),o||!f&&!v)try{for(var d=r(t.childNodes),p=d.next();!p.done;p=d.next()){var h=p.value;if(h.nodeType===Node.ELEMENT_NODE)if(!o&&y(h))c.push(h);else{if(h.hasAttribute("l-state"))continue;c.push.apply(c,i([],n(e(h,o))))}}}catch(e){l={error:e}}finally{try{p&&!p.done&&(u=d.return)&&u.call(d)}finally{if(l)throw l.error}}return c},g=function(e,t,n){var i,a;void 0===t&&(t={}),void 0===n&&(n=!1);var l=[],u=void 0!==f(e,"component")&&y(e),s=m(e,u,n),c="l-mask";try{for(var v=r(s),d=v.next();!d.done;d=v.next()){var p=d.value;if(p.hasAttribute(c)&&p.removeAttribute(c),new RegExp("(l-|"+Object.keys(o).join("|")+")\\w+","gim").test(p.outerHTML)){var b=h(p,t);b&&l.push(b)}}}catch(e){i={error:e}}finally{try{d&&!d.done&&(a=v.return)&&a.call(v)}finally{if(i)throw i.error}}return l},w=function(e,i,o,a){void 0===o&&(o={}),void 0===a&&(a=[]);var l,s=Object.keys(i);(l=function(){var l,c,f,v,d,p,y;return t(this,(function(h){switch(h.label){case 0:l=function(e){var l,c,f,v,d,p,y,h,b,m;return t(this,(function(g){switch(g.label){case 0:if((l=e.type===u.STATIC)&&(e.type=u.NULL),!a.some((function(t){return e.deps.includes(t)}))&&!l)return[2,"continue"];c=function(r,n){var u,c,f,v,d;return t(this,(function(t){switch(t.label){case 0:return[4];case 1:return t.sent(),u=r.split(/:|\./)[0],s.includes(u.toUpperCase())?(c=a.some((function(e){return n.deps.includes(e)})),f="l-mask"===r,v=0===Object.keys(n.deps).length,(c||l||v)&&(d={el:e.el,parts:r.split(/:|\./gim),data:n,node:e,state:o},O(d,i),(v||f)&&(delete e.directives[r],f&&e.el.removeAttribute("l-mask"))),[2]):[2,"continue"]}}))},g.label=1;case 1:g.trys.push([1,6,7,8]),b=void 0,f=r(Object.entries(e.directives)),v=f.next(),g.label=2;case 2:return v.done?[3,5]:(d=n(v.value,2),p=d[0],y=d[1],[5,c(p,y)]);case 3:g.sent(),g.label=4;case 4:return v=f.next(),[3,2];case 5:return[3,8];case 6:return h=g.sent(),b={error:h},[3,8];case 7:try{v&&!v.done&&(m=f.return)&&m.call(f)}finally{if(b)throw b.error}return[7];case 8:return[2]}}))},h.label=1;case 1:h.trys.push([1,6,7,8]),c=r(e),f=c.next(),h.label=2;case 2:return f.done?[3,5]:(v=f.value,[5,l(v)]);case 3:h.sent(),h.label=4;case 4:return f=c.next(),[3,2];case 5:return[3,8];case 6:return d=h.sent(),p={error:d},[3,8];case 7:try{f&&!f.done&&(y=c.return)&&y.call(c)}finally{if(p)throw p.error}return[7];case 8:return[2]}}))}(),function e(){var t=performance.now(),r=null;do{r=l.next()}while(performance.now()-t<25&&!r.done);r.done||setTimeout(e)})()},x=function(e,t,o,a){var l,u,s=[];try{for(var c=r(e),f=c.next();!f.done;f=c.next()){var v=f.value;s.push.apply(s,i([],n(v.deps)))}}catch(e){l={error:e}}finally{try{f&&!f.done&&(u=c.return)&&u.call(c)}finally{if(l)throw l.error}}var p=d(i(i([],n(t)),n(s)));o.deps=p,o.directives[a].deps=p},A={BIND:function(e){var t=e.el,r=e.parts,n=e.data,i=e.state;switch(r[1]){case"class":var o=n.compute(i);if("string"==typeof o)return t.setAttribute("class",s(t.className+" "+o));if(o instanceof Array)return t.setAttribute("class",s(t.className+" "+o.join(" ")));var a=[];for(var u in o)o[u]&&a.push(u);var c=new RegExp("\\b"+Object.keys(o).join("|")+"\\b","gim"),f=t.className.replace(c,"");if(a.length>0)return t.setAttribute("class",s(f+" "+a.join(" ")));if(s(f).length>0)return t.setAttribute("class",s(f));if(t.hasAttribute("class"))return t.removeAttribute("class");break;case"style":var v=n.compute(i);for(var u in t.removeAttribute("style"),v)t.style[u]=v[u];break;default:var d=n.compute(i);if("object"===l(d)&&null!==d)for(var u in d)d[u]?t.setAttribute(u,d[u]):t.removeAttribute(u);else d?t.setAttribute(r[1],d):t.removeAttribute(r[1])}},HTML:function(e){var t,r=e.el,n=e.data,i=e.state,o=e.node;o=o;var a=f(r,"component");r.innerHTML=null!==(t=n.compute(i))&&void 0!==t?t:n.value;var l=g(r,i,!0);a||x(l,n.deps,o,"html"),w(l,A,i,n.deps),v(r,"component",!0)},MODEL:function(e){var t=e.el,r=e.parts,n=e.data,i=e.state,o=t,a=i[n.value],l="checkbox"===o.type?"checked":"value";if(o[l]!==String(a)&&(o[l]=a),!f(o,"__model_registered")){o.addEventListener("debounce"===r[1]?"change":"input",(function(){return function(e,t,r,n){"checkbox"===e.type&&(e.value=String(e.checked));var i,o="number"==typeof t&&!isNaN(e.value),a="boolean"==typeof t&&("true"===e.value||"false"===e.value),l=null==t&&("null"===e.value||"undefined"===e.value);return i=o?parseFloat(e.value):a?"true"===e.value:l?"null"===e.value?null:void 0:String(e.value),n[r.value]=i,i}(o,a,n,i)})),v(o,"__model_registered",!0)}},SHOW:function(e){var t=e.el,r=e.data,n=e.state;t.style.display=r.compute(n)?"":"none",0===t.style.length&&t.removeAttribute("style")},ON:function(e){var t=e.el,n=e.parts,i=e.data,o=e.state,a={},l=n.slice(2);if(!f(t,"__on_"+n[1]+"_registered")){var u=["outside","global"].some((function(e){return String(l).includes(e)}))?window:t;a.once=l.includes("once"),a.passive=l.includes("passive"),u.addEventListener(n[1],(function(e){var n,a;if(e instanceof KeyboardEvent&&/\d/gim.test(String(l))){var u=[];try{for(var s=r(l),c=s.next();!c.done;c=s.next()){var f=c.value;isNaN(f)||u.push(Number(f))}}catch(e){n={error:e}}finally{try{c&&!c.done&&(a=s.return)&&a.call(s)}finally{if(n)throw n.error}}if(!u.includes(e.keyCode))return}if(l.includes("prevent")&&e.preventDefault(),l.includes("stop")&&e.stopPropagation(),!l.includes("self")||e.target===t){if(l.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}i.compute(o,e)}}),a),v(t,"__on_"+n[1]+"_registered",!0)}},TEXT:function(e){var t,r=e.el,n=e.data,i=e.state;r.textContent=null!==(t=n.compute(i))&&void 0!==t?t:n.value},FOR:function(e){var t,r=e.el,i=e.data,o=e.state,a=e.node;a=a;var l=f(r,"component");v(r,"component",!0);var u=n(i.value.split(/\s+(?:in|of)\s+/gim),2),s=u[0],d=u[1],y=n(null==s?void 0:s.trim().replace(/\(|\)/gim,"").split(","),2),h=y[0],b=y[1],m=null!==(t=o[null==d?void 0:d.trim()])&&void 0!==t?t:p(null==d?void 0:d.trim(),r,!0)(o),O=g(r,o),S=f(r,"__for_template");r.innerHTML.trim()===S&&(r.innerHTML="");var j=(null==m?void 0:m.length)-r.children.length;if(0===(null==m?void 0:m.length))r.innerHTML="";else if(0!==j)for(var _=Math.abs(j);_>0;--_)if(j<0)r.removeChild(r.lastChild);else{var k=S.startsWith("<th")?"thead":S.startsWith("<td")||S.startsWith("<tr")?"tbody":"div",E=document.createElement(k),N=S;h&&(N=N.replace(c("this\\."+h.trim()),d+"["+(m.length-_)+"]")),b&&(N=N.replace(c("this\\."+b.trim()),String(m.length-_))),E.innerHTML=N,r.appendChild(E.firstElementChild)}l||(x(O,i.deps,a,"for"),r.removeAttribute("l-for")),w(g(r,o,!0),A,o,a.deps)}},O=function(e,t){t[e.parts[0].toUpperCase()](e)},S=function(e,t,o){void 0===o&&(o={});var a={get:function(e,t){return"object"===l(e[t])&&null!==e[t]?new Proxy(e[t],a):e[t]},set:function(a,u,s){var c,f;if("function"==typeof e[u]||u.startsWith("$"))return!1;var v=!isNaN(Number(u))||"length"===u,d=[u];a instanceof Array&&v?d.push.apply(d,i([],n(Object.keys(e).filter((function(t){return e[t]instanceof Array&&(r=e[t],n=a,r instanceof Array&&n instanceof Array&&r.length===n.length&&r.every((function(e,t){return e===n[t]})));var r,n}))))):Object.is(a,e)||d.push.apply(d,i([],n(Object.keys(e).filter((function(t){return"object"===l(e[t])&&JSON.stringify(e[t]).indexOf(u)>-1}))))),a[u]=s,t(d);try{for(var p=r(Object.entries(o)),y=p.next();!y.done;y=p.next()){var h=n(y.value,2),b=h[0],m=h[1];d.includes(b)&&m()}}catch(e){c={error:e}}finally{try{y&&!y.done&&(f=p.return)&&f.call(p)}finally{if(c)throw c.error}}return!0}};return new Proxy(Object.seal(e),a)},j=function(){function t(e,t,r){void 0===e&&(e={}),void 0===t&&(t={}),void 0===r&&(r={}),this.state=e,this.directives=t,this.watchers=r}return t.prototype.mount=function(t){var r=this,n="string"==typeof t?document.querySelector(t):t;return this.ast=g(n,this.state),this.directives=e(e({},this.directives),A),this.state=S(e(e({},this.state),{$render:function(e){return void 0===e&&(e=Object.keys(r.state)),r.render(e)}}),this.render.bind(this),this.watchers),this.render(),v(n,"component",this),this.handleMutations(n),this.state},t.prototype.directive=function(e,t){this.directives[e.toUpperCase()]=t},t.prototype.watch=function(e,t){this.watchers[e]=t},t.prototype.render=function(e){void 0===e&&(e=Object.keys(this.state)),w(this.ast,A,this.state,e)},t.prototype.handleMutations=function(e){var t=this;new MutationObserver((function(n){var i,o;try{for(var l=r(n),u=l.next();!u.done;u=l.next()){var s=u.value,c=String(s.attributeName);"attributes"===s.type&&c.startsWith(a)&&"l-for"!==c&&(t.ast=g(e,t.state),t.render(),console.log("render"))}}catch(e){i={error:e}}finally{try{u&&!u.done&&(o=l.return)&&o.call(l)}finally{if(i)throw i.error}}})).observe(e,{attributes:!0,subtree:!0})},t}(),_=function(e){return new j(e)},k=function(e){var t,o;void 0===e&&(e=document);var a="l-state",l=i([],n(e.querySelectorAll("[l-state]"))).filter((function(e){return void 0===f(e,"component")}));try{for(var u=r(l),s=u.next();!s.done;s=u.next()){var c=s.value,v=c.getAttribute(a),d=p(""+(v||"{}"),c,!0)({});_(d).mount(c)}}catch(e){t={error:e}}finally{try{s&&!s.done&&(o=u.return)&&o.call(u)}finally{if(t)throw t.error}}},E=Object.freeze({__proto__:null,component:_,compile:g,render:w,reactive:S,directives:A,computeExpression:p,init:k});return"loading"===document.readyState&&document.addEventListener("DOMContentLoaded",(function(){var e=window.LuciaInit;e?e(k):k()})),E}(); |
@@ -242,36 +242,48 @@ 'use strict'; | ||
const concurrent = (generatorFunction) => { | ||
const generator = generatorFunction(); | ||
return function next() { | ||
const start = performance.now(); | ||
let task = null; | ||
do { | ||
task = generator.next(); | ||
} while (performance.now() - start < 25 && !task.done); | ||
if (task.done) | ||
return; | ||
setTimeout(next); | ||
}; | ||
}; | ||
const render = (ast, directives, state = {}, changedProps = []) => { | ||
if (typeof changedProps === 'string') | ||
changedProps = [changedProps]; | ||
const legalDirectiveNames = Object.keys(directives); | ||
for (let i = 0; i < ast.length; i++) { | ||
const node = ast[i]; | ||
if (node.type === ASTNodeType.NULL) | ||
continue; | ||
const isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) | ||
node.type = ASTNodeType.NULL; | ||
const nodeHasDep = changedProps.some((prop) => node.deps.includes(prop)); | ||
if (!nodeHasDep && !isStatic) | ||
continue; | ||
for (const [directiveName, directiveData] of Object.entries(node.directives)) { | ||
const rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) | ||
concurrent(function* () { | ||
for (const node of ast) { | ||
const isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) | ||
node.type = ASTNodeType.NULL; | ||
const nodeHasDep = changedProps.some((prop) => node.deps.includes(prop)); | ||
if (!nodeHasDep && !isStatic) | ||
continue; | ||
const directiveHasDep = changedProps.some((prop) => directiveData.deps.includes(prop)); | ||
const isMaskDirective = directiveName === `${DIRECTIVE_PREFIX}mask`; | ||
const isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
const directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node, | ||
state, | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(`${DIRECTIVE_PREFIX}mask`); | ||
for (const [directiveName, directiveData] of Object.entries(node.directives)) { | ||
yield; | ||
const rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) | ||
continue; | ||
const directiveHasDep = changedProps.some((prop) => directiveData.deps.includes(prop)); | ||
const isMaskDirective = directiveName === `${DIRECTIVE_PREFIX}mask`; | ||
const isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
const directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node, | ||
state, | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(`${DIRECTIVE_PREFIX}mask`); | ||
} | ||
} | ||
@@ -281,3 +293,3 @@ } | ||
} | ||
} | ||
})(); | ||
}; | ||
@@ -417,3 +429,3 @@ | ||
else if (arrayDiff !== 0) { | ||
for (let i = Math.abs(arrayDiff); i > 0; i--) { | ||
for (let i = Math.abs(arrayDiff); i > 0; --i) { | ||
if (arrayDiff < 0) | ||
@@ -444,3 +456,3 @@ el.removeChild(el.lastChild); | ||
} | ||
render(compile(el, state), directives, state, node.deps); | ||
render(compile(el, state, true), directives, state, node.deps); | ||
}; | ||
@@ -478,12 +490,17 @@ | ||
set(target, key, value) { | ||
if (typeof state[key] === 'function') | ||
if (typeof state[key] === 'function' || key.startsWith('$')) | ||
return false; | ||
const hasArrayMutationKey = !isNaN(Number(key)) || key === 'length'; | ||
let props = [key]; | ||
const props = [key]; | ||
if (target instanceof Array && hasArrayMutationKey) { | ||
props = Object.keys(state).filter((prop) => arrayEquals(state[prop], target)); | ||
props.push(...Object.keys(state).filter((prop) => { | ||
return (state[prop] instanceof Array && | ||
arrayEquals(state[prop], target)); | ||
})); | ||
} | ||
else { | ||
if (Object.keys(state).some((prop) => target[prop] === undefined)) { | ||
props = Object.keys(state).filter((prop) => typeof state[prop] === 'object'); | ||
if (!Object.is(target, state)) { | ||
props.push(...Object.keys(state).filter((prop) => { | ||
return (typeof state[prop] === 'object' && JSON.stringify(state[prop]).indexOf(key) > -1); | ||
})); | ||
} | ||
@@ -517,2 +534,3 @@ } | ||
setElementCustomProp(rootEl, 'component', this); | ||
this.handleMutations(rootEl); | ||
return this.state; | ||
@@ -529,2 +547,17 @@ } | ||
} | ||
handleMutations(el) { | ||
const mutationObserver = new MutationObserver((mutationsList) => { | ||
for (const mutation of mutationsList) { | ||
const attrName = String(mutation.attributeName); | ||
if (mutation.type === 'attributes' && | ||
attrName.startsWith(DIRECTIVE_PREFIX) && | ||
attrName !== `${DIRECTIVE_PREFIX}for`) { | ||
this.ast = compile(el, this.state); | ||
this.render(); | ||
console.log('render'); | ||
} | ||
} | ||
}); | ||
mutationObserver.observe(el, { attributes: true, subtree: true }); | ||
} | ||
} | ||
@@ -531,0 +564,0 @@ const component = (state) => new Component(state); |
@@ -1,1 +0,1 @@ | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e;!function(e){e["@"]="on",e[":"]="bind"}(e||(e={}));const t=e=>e.replace(/\s+/gim," ").trim();var s;!function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(s||(s={}));const n=e=>new RegExp(`\\b${e}\\b`,"gim"),r=(e,t)=>e[t],o=(e,t,s)=>{e[t]=s},i=e=>[...new Set(e)],c=(e,t,s=!0,n={})=>{const r=`with($state){${s?`return ${e}`:e}}`;return(s,o)=>{try{const i=s[e];if(i)return"function"==typeof i?s[e]():i;{const e={$state:s,$el:t,$emit:(e,s,n=!0)=>{const r=new CustomEvent(e,s);(n?window:t||window).dispatchEvent(r)},$event:o,$refs:n};return new Function(...Object.keys(e),r)(...Object.values(e))}}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${e}"\nElement:`,t)}}},l=e=>e.hasAttribute("l-for"),a=(e,t)=>{const[r,o]=u(e,t),i=Object.keys(r).length>0,c=Object.values(r).some((({value:e})=>Object.keys(t).some((t=>n(t).test(e)))))?s.DYNAMIC:s.STATIC;return i?{el:e,deps:o,directives:r,type:c}:void 0},u=(t,s={})=>{const l={},a=(()=>{const e=document.querySelectorAll("[l-ref]"),t={};for(const s of e){const e=s.getAttribute("l-ref");e&&(t[e]=s)}return t})(),u=[];for(const{name:d,value:p}of t.attributes){const f="l-state"===d,h=d.startsWith("l-"),m=Object.keys(e).some((e=>d.startsWith(e)));if(f||!h&&!m)continue;const v=[],b=Object.keys(s);let y=!0;const g=b.filter((e=>{const t=n(e).test(String(p));if(t&&"function"==typeof s[e]){const t=b.filter((t=>n(t).test(String(s[e]))));v.push(...t)}return t}));/on|@/gim.test(d)&&(y=!1),d.includes("for")&&void 0===r(t,"__for_template")&&(o(t,"__for_template",String(t.innerHTML).trim()),y=!1);const A=i([...g,...v]);u.push(...A);const $={compute:c(p,t,y,a),deps:A,value:p};l[(h?d.slice("l-".length):`${e[d[0]]}:${d.slice(1)}`).toLowerCase()]=$}return[l,i(u)]},d=(e,t=!1,s=!1)=>{const n=[],r=l(e),o=!!(i=e).parentElement&&i.parentElement.hasAttribute("l-for");var i;if(!t&&(r||o))return n;if(s||t&&r||n.push(e),t||!r&&!o)for(const s of e.childNodes)if(s.nodeType===Node.ELEMENT_NODE)if(!t&&l(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...d(s,t))}return n},p=(t,s={},n=!1)=>{const o=[],i=void 0!==r(t,"component")&&l(t),c=d(t,i,n),u="l-mask";for(const t of c)if(t.hasAttribute(u)&&t.removeAttribute(u),new RegExp(`(l-|${Object.keys(e).join("|")})\\w+`,"gim").test(t.outerHTML)){const e=a(t,s);e&&o.push(e)}return o},f=(e,t,n={},r=[])=>{"string"==typeof r&&(r=[r]);const o=Object.keys(t);for(let i=0;i<e.length;i++){const c=e[i];if(c.type===s.NULL)continue;const l=c.type===s.STATIC;l&&(c.type=s.NULL);if(r.some((e=>c.deps.includes(e)))||l)for(const[e,s]of Object.entries(c.directives)){const i=e.split(/:|\./)[0];if(!o.includes(i.toUpperCase()))continue;const a=r.some((e=>s.deps.includes(e))),u="l-mask"===e,d=0===Object.keys(s.deps).length;if(a||l||d){const r={el:c.el,parts:e.split(/:|\./gim),data:s,node:c,state:n};v(r,t),(d||u)&&(delete c.directives[e],u&&c.el.removeAttribute("l-mask"))}}}},h=(e,t,s,n)=>{const r=[];for(const t of e)r.push(...t.deps);const o=i([...t,...r]);s.deps=o,s.directives[n].deps=o},m={BIND:({el:e,parts:s,data:n,state:r})=>{switch(s[1]){case"class":const o=n.compute(r);if("string"==typeof o)return e.setAttribute("class",t(`${e.className} ${o}`));if(o instanceof Array)return e.setAttribute("class",t(`${e.className} ${o.join(" ")}`));{const s=[];for(const e in o)o[e]&&s.push(e);const n=new RegExp(`\\b${Object.keys(o).join("|")}\\b`,"gim"),r=e.className.replace(n,"");if(s.length>0)return e.setAttribute("class",t(`${r} ${s.join(" ")}`));if(t(r).length>0)return e.setAttribute("class",t(r));if(e.hasAttribute("class"))return e.removeAttribute("class")}break;case"style":const i=n.compute(r);e.removeAttribute("style");for(const t in i)e.style[t]=i[t];break;default:const c=n.compute(r);if("object"==typeof c&&null!==c)for(const t in c)c[t]?e.setAttribute(t,c[t]):e.removeAttribute(t);else c?e.setAttribute(s[1],c):e.removeAttribute(s[1])}},HTML:({el:e,data:t,state:s,node:n})=>{var i;n=n;const c=r(e,"component");e.innerHTML=null!==(i=t.compute(s))&&void 0!==i?i:t.value;const l=p(e,s,!0);c||h(l,t.deps,n,"html"),f(l,m,s,t.deps),o(e,"component",!0)},MODEL:({el:e,parts:t,data:s,state:n})=>{const i=e,c=n[s.value],l="checkbox"===i.type?"checked":"value";if(i[l]!==String(c)&&(i[l]=c),!r(i,"__model_registered")){const e=()=>((e,t,s,n)=>{"checkbox"===e.type&&(e.value=String(e.checked));const r="number"==typeof t&&!isNaN(e.value),o="boolean"==typeof t&&("true"===e.value||"false"===e.value),i=null==t&&("null"===e.value||"undefined"===e.value);let c;return c=r?parseFloat(e.value):o?"true"===e.value:i?"null"===e.value?null:void 0:String(e.value),n[s.value]=c,c})(i,c,s,n);i.addEventListener("debounce"===t[1]?"change":"input",e),o(i,"__model_registered",!0)}},SHOW:({el:e,data:t,state:s})=>{e.style.display=t.compute(s)?"":"none",0===e.style.length&&e.removeAttribute("style")},ON:({el:e,parts:t,data:s,state:n})=>{const i={},c=t.slice(2);if(r(e,`__on_${t[1]}_registered`))return;const l=["outside","global"].some((e=>String(c).includes(e)))?window:e;i.once=c.includes("once"),i.passive=c.includes("passive"),l.addEventListener(t[1],(t=>{if(t instanceof KeyboardEvent&&/\d/gim.test(String(c))){const e=[];for(const t of c)isNaN(t)||e.push(Number(t));if(!e.includes(t.keyCode))return}if(c.includes("prevent")&&t.preventDefault(),c.includes("stop")&&t.stopPropagation(),!c.includes("self")||t.target===e){if(c.includes("outside")){if(e.contains(t.target))return;if(e.offsetWidth<1&&e.offsetHeight<1)return}s.compute(n,t)}}),i),o(e,`__on_${t[1]}_registered`,!0)},TEXT:({el:e,data:t,state:s})=>{var n;e.textContent=null!==(n=t.compute(s))&&void 0!==n?n:t.value},FOR:({el:e,data:t,state:s,node:i})=>{var l;i=i;const a=r(e,"component");o(e,"component",!0);const[u,d]=t.value.split(/\s+(?:in|of)\s+/gim),[v,b]=null==u?void 0:u.trim().replace(/\(|\)/gim,"").split(","),y=null!==(l=s[null==d?void 0:d.trim()])&&void 0!==l?l:c(null==d?void 0:d.trim(),e,!0)(s),g=p(e,s);let A=r(e,"__for_template");e.innerHTML.trim()===A&&(e.innerHTML="");const $=(null==y?void 0:y.length)-e.children.length;if(0===(null==y?void 0:y.length))e.innerHTML="";else if(0!==$)for(let t=Math.abs($);t>0;t--)if($<0)e.removeChild(e.lastChild);else{const s=A.startsWith("<th")?"thead":A.startsWith("<td")||A.startsWith("<tr")?"tbody":"div",r=document.createElement(s);let o=A;v&&(o=o.replace(n(`this\\.${v.trim()}`),`${d}[${y.length-t}]`)),b&&(o=o.replace(n(`this\\.${b.trim()}`),String(y.length-t))),r.innerHTML=o,e.appendChild(r.firstElementChild)}a||(h(g,t.deps,i,"for"),e.removeAttribute("l-for")),f(p(e,s),m,s,i.deps)}},v=(e,t)=>{t[e.parts[0].toUpperCase()](e)},b=(e,t,s={})=>{const n={get:(e,t)=>"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],n):e[t],set(n,r,o){if("function"==typeof e[r])return!1;const i=!isNaN(Number(r))||"length"===r;let c=[r];n instanceof Array&&i?c=Object.keys(e).filter((t=>{return s=e[t],r=n,s instanceof Array&&r instanceof Array&&s.length===r.length&&s.every(((e,t)=>e===r[t]));var s,r})):Object.keys(e).some((e=>void 0===n[e]))&&(c=Object.keys(e).filter((t=>"object"==typeof e[t]))),n[r]=o,t(c);for(const[e,t]of Object.entries(s))c.includes(e)&&t();return!0}};return new Proxy(Object.seal(e),n)};class y{constructor(e={},t={},s={}){this.state=e,this.directives=t,this.watchers=s}mount(e){const t="string"==typeof e?document.querySelector(e):e;return this.ast=p(t,this.state),this.directives={...this.directives,...m},this.state=b({...this.state,$render:(e=Object.keys(this.state))=>this.render(e)},this.render.bind(this),this.watchers),this.render(),o(t,"component",this),this.state}directive(e,t){this.directives[e.toUpperCase()]=t}watch(e,t){this.watchers[e]=t}render(e=Object.keys(this.state)){f(this.ast,m,this.state,e)}}const g=e=>new y(e);exports.compile=p,exports.component=g,exports.computeExpression=c,exports.directives=m,exports.init=(e=document)=>{const t="l-state",s=[...e.querySelectorAll("[l-state]")].filter((e=>void 0===r(e,"component")));for(const e of s){const s=e.getAttribute(t),n=c(`${s||"{}"}`,e,!0)({});g(n).mount(e)}},exports.reactive=b,exports.render=f; | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t;!function(t){t["@"]="on",t[":"]="bind"}(t||(t={}));const e=t=>t.replace(/\s+/gim," ").trim();var s;!function(t){t[t.NULL=-1]="NULL",t[t.STATIC=0]="STATIC",t[t.DYNAMIC=1]="DYNAMIC"}(s||(s={}));const n=t=>new RegExp(`\\b${t}\\b`,"gim"),r=(t,e)=>t[e],o=(t,e,s)=>{t[e]=s},i=t=>[...new Set(t)],c=(t,e,s=!0,n={})=>{const r=`with($state){${s?`return ${t}`:t}}`;return(s,o)=>{try{const i=s[t];if(i)return"function"==typeof i?s[t]():i;{const t={$state:s,$el:e,$emit:(t,s,n=!0)=>{const r=new CustomEvent(t,s);(n?window:e||window).dispatchEvent(r)},$event:o,$refs:n};return new Function(...Object.keys(t),r)(...Object.values(t))}}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${t}"\nElement:`,e)}}},l=t=>t.hasAttribute("l-for"),a=(t,e)=>{const[r,o]=u(t,e),i=Object.keys(r).length>0,c=Object.values(r).some((({value:t})=>Object.keys(e).some((e=>n(e).test(t)))))?s.DYNAMIC:s.STATIC;return i?{el:t,deps:o,directives:r,type:c}:void 0},u=(e,s={})=>{const l={},a=(()=>{const t=document.querySelectorAll("[l-ref]"),e={};for(const s of t){const t=s.getAttribute("l-ref");t&&(e[t]=s)}return e})(),u=[];for(const{name:d,value:f}of e.attributes){const p="l-state"===d,h=d.startsWith("l-"),m=Object.keys(t).some((t=>d.startsWith(t)));if(p||!h&&!m)continue;const v=[],b=Object.keys(s);let y=!0;const g=b.filter((t=>{const e=n(t).test(String(f));if(e&&"function"==typeof s[t]){const e=b.filter((e=>n(e).test(String(s[t]))));v.push(...e)}return e}));/on|@/gim.test(d)&&(y=!1),d.includes("for")&&void 0===r(e,"__for_template")&&(o(e,"__for_template",String(e.innerHTML).trim()),y=!1);const A=i([...g,...v]);u.push(...A);const $={compute:c(f,e,y,a),deps:A,value:f};l[(h?d.slice("l-".length):`${t[d[0]]}:${d.slice(1)}`).toLowerCase()]=$}return[l,i(u)]},d=(t,e=!1,s=!1)=>{const n=[],r=l(t),o=!!(i=t).parentElement&&i.parentElement.hasAttribute("l-for");var i;if(!e&&(r||o))return n;if(s||e&&r||n.push(t),e||!r&&!o)for(const s of t.childNodes)if(s.nodeType===Node.ELEMENT_NODE)if(!e&&l(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...d(s,e))}return n},f=(e,s={},n=!1)=>{const o=[],i=void 0!==r(e,"component")&&l(e),c=d(e,i,n),u="l-mask";for(const e of c)if(e.hasAttribute(u)&&e.removeAttribute(u),new RegExp(`(l-|${Object.keys(t).join("|")})\\w+`,"gim").test(e.outerHTML)){const t=a(e,s);t&&o.push(t)}return o},p=(t,e,n={},r=[])=>{const o=Object.keys(e);(t=>{const e=t();return function t(){const s=performance.now();let n=null;do{n=e.next()}while(performance.now()-s<25&&!n.done);n.done||setTimeout(t)}})((function*(){for(const i of t){const t=i.type===s.STATIC;t&&(i.type=s.NULL);if(r.some((t=>i.deps.includes(t)))||t)for(const[s,c]of Object.entries(i.directives)){yield;const l=s.split(/:|\./)[0];if(!o.includes(l.toUpperCase()))continue;const a=r.some((t=>c.deps.includes(t))),u="l-mask"===s,d=0===Object.keys(c.deps).length;if(a||t||d){const t={el:i.el,parts:s.split(/:|\./gim),data:c,node:i,state:n};v(t,e),(d||u)&&(delete i.directives[s],u&&i.el.removeAttribute("l-mask"))}}}}))()},h=(t,e,s,n)=>{const r=[];for(const e of t)r.push(...e.deps);const o=i([...e,...r]);s.deps=o,s.directives[n].deps=o},m={BIND:({el:t,parts:s,data:n,state:r})=>{switch(s[1]){case"class":const o=n.compute(r);if("string"==typeof o)return t.setAttribute("class",e(`${t.className} ${o}`));if(o instanceof Array)return t.setAttribute("class",e(`${t.className} ${o.join(" ")}`));{const s=[];for(const t in o)o[t]&&s.push(t);const n=new RegExp(`\\b${Object.keys(o).join("|")}\\b`,"gim"),r=t.className.replace(n,"");if(s.length>0)return t.setAttribute("class",e(`${r} ${s.join(" ")}`));if(e(r).length>0)return t.setAttribute("class",e(r));if(t.hasAttribute("class"))return t.removeAttribute("class")}break;case"style":const i=n.compute(r);t.removeAttribute("style");for(const e in i)t.style[e]=i[e];break;default:const c=n.compute(r);if("object"==typeof c&&null!==c)for(const e in c)c[e]?t.setAttribute(e,c[e]):t.removeAttribute(e);else c?t.setAttribute(s[1],c):t.removeAttribute(s[1])}},HTML:({el:t,data:e,state:s,node:n})=>{var i;n=n;const c=r(t,"component");t.innerHTML=null!==(i=e.compute(s))&&void 0!==i?i:e.value;const l=f(t,s,!0);c||h(l,e.deps,n,"html"),p(l,m,s,e.deps),o(t,"component",!0)},MODEL:({el:t,parts:e,data:s,state:n})=>{const i=t,c=n[s.value],l="checkbox"===i.type?"checked":"value";if(i[l]!==String(c)&&(i[l]=c),!r(i,"__model_registered")){const t=()=>((t,e,s,n)=>{"checkbox"===t.type&&(t.value=String(t.checked));const r="number"==typeof e&&!isNaN(t.value),o="boolean"==typeof e&&("true"===t.value||"false"===t.value),i=null==e&&("null"===t.value||"undefined"===t.value);let c;return c=r?parseFloat(t.value):o?"true"===t.value:i?"null"===t.value?null:void 0:String(t.value),n[s.value]=c,c})(i,c,s,n);i.addEventListener("debounce"===e[1]?"change":"input",t),o(i,"__model_registered",!0)}},SHOW:({el:t,data:e,state:s})=>{t.style.display=e.compute(s)?"":"none",0===t.style.length&&t.removeAttribute("style")},ON:({el:t,parts:e,data:s,state:n})=>{const i={},c=e.slice(2);if(r(t,`__on_${e[1]}_registered`))return;const l=["outside","global"].some((t=>String(c).includes(t)))?window:t;i.once=c.includes("once"),i.passive=c.includes("passive"),l.addEventListener(e[1],(e=>{if(e instanceof KeyboardEvent&&/\d/gim.test(String(c))){const t=[];for(const e of c)isNaN(e)||t.push(Number(e));if(!t.includes(e.keyCode))return}if(c.includes("prevent")&&e.preventDefault(),c.includes("stop")&&e.stopPropagation(),!c.includes("self")||e.target===t){if(c.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}s.compute(n,e)}}),i),o(t,`__on_${e[1]}_registered`,!0)},TEXT:({el:t,data:e,state:s})=>{var n;t.textContent=null!==(n=e.compute(s))&&void 0!==n?n:e.value},FOR:({el:t,data:e,state:s,node:i})=>{var l;i=i;const a=r(t,"component");o(t,"component",!0);const[u,d]=e.value.split(/\s+(?:in|of)\s+/gim),[v,b]=null==u?void 0:u.trim().replace(/\(|\)/gim,"").split(","),y=null!==(l=s[null==d?void 0:d.trim()])&&void 0!==l?l:c(null==d?void 0:d.trim(),t,!0)(s),g=f(t,s);let A=r(t,"__for_template");t.innerHTML.trim()===A&&(t.innerHTML="");const $=(null==y?void 0:y.length)-t.children.length;if(0===(null==y?void 0:y.length))t.innerHTML="";else if(0!==$)for(let e=Math.abs($);e>0;--e)if($<0)t.removeChild(t.lastChild);else{const s=A.startsWith("<th")?"thead":A.startsWith("<td")||A.startsWith("<tr")?"tbody":"div",r=document.createElement(s);let o=A;v&&(o=o.replace(n(`this\\.${v.trim()}`),`${d}[${y.length-e}]`)),b&&(o=o.replace(n(`this\\.${b.trim()}`),String(y.length-e))),r.innerHTML=o,t.appendChild(r.firstElementChild)}a||(h(g,e.deps,i,"for"),t.removeAttribute("l-for")),p(f(t,s,!0),m,s,i.deps)}},v=(t,e)=>{e[t.parts[0].toUpperCase()](t)},b=(t,e,s={})=>{const n={get:(t,e)=>"object"==typeof t[e]&&null!==t[e]?new Proxy(t[e],n):t[e],set(n,r,o){if("function"==typeof t[r]||r.startsWith("$"))return!1;const i=!isNaN(Number(r))||"length"===r,c=[r];n instanceof Array&&i?c.push(...Object.keys(t).filter((e=>{return t[e]instanceof Array&&(s=t[e],r=n,s instanceof Array&&r instanceof Array&&s.length===r.length&&s.every(((t,e)=>t===r[e])));var s,r}))):Object.is(n,t)||c.push(...Object.keys(t).filter((e=>"object"==typeof t[e]&&JSON.stringify(t[e]).indexOf(r)>-1))),n[r]=o,e(c);for(const[t,e]of Object.entries(s))c.includes(t)&&e();return!0}};return new Proxy(Object.seal(t),n)};class y{constructor(t={},e={},s={}){this.state=t,this.directives=e,this.watchers=s}mount(t){const e="string"==typeof t?document.querySelector(t):t;return this.ast=f(e,this.state),this.directives={...this.directives,...m},this.state=b({...this.state,$render:(t=Object.keys(this.state))=>this.render(t)},this.render.bind(this),this.watchers),this.render(),o(e,"component",this),this.handleMutations(e),this.state}directive(t,e){this.directives[t.toUpperCase()]=e}watch(t,e){this.watchers[t]=e}render(t=Object.keys(this.state)){p(this.ast,m,this.state,t)}handleMutations(t){new MutationObserver((e=>{for(const s of e){const e=String(s.attributeName);"attributes"===s.type&&e.startsWith("l-")&&"l-for"!==e&&(this.ast=f(t,this.state),this.render(),console.log("render"))}})).observe(t,{attributes:!0,subtree:!0})}}const g=t=>new y(t);exports.compile=f,exports.component=g,exports.computeExpression=c,exports.directives=m,exports.init=(t=document)=>{const e="l-state",s=[...t.querySelectorAll("[l-state]")].filter((t=>void 0===r(t,"component")));for(const t of s){const s=t.getAttribute(e),n=c(`${s||"{}"}`,t,!0)({});g(n).mount(t)}},exports.reactive=b,exports.render=p; |
@@ -238,36 +238,48 @@ const DIRECTIVE_PREFIX = 'l-'; | ||
const concurrent = (generatorFunction) => { | ||
const generator = generatorFunction(); | ||
return function next() { | ||
const start = performance.now(); | ||
let task = null; | ||
do { | ||
task = generator.next(); | ||
} while (performance.now() - start < 25 && !task.done); | ||
if (task.done) | ||
return; | ||
setTimeout(next); | ||
}; | ||
}; | ||
const render = (ast, directives, state = {}, changedProps = []) => { | ||
if (typeof changedProps === 'string') | ||
changedProps = [changedProps]; | ||
const legalDirectiveNames = Object.keys(directives); | ||
for (let i = 0; i < ast.length; i++) { | ||
const node = ast[i]; | ||
if (node.type === ASTNodeType.NULL) | ||
continue; | ||
const isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) | ||
node.type = ASTNodeType.NULL; | ||
const nodeHasDep = changedProps.some((prop) => node.deps.includes(prop)); | ||
if (!nodeHasDep && !isStatic) | ||
continue; | ||
for (const [directiveName, directiveData] of Object.entries(node.directives)) { | ||
const rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) | ||
concurrent(function* () { | ||
for (const node of ast) { | ||
const isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) | ||
node.type = ASTNodeType.NULL; | ||
const nodeHasDep = changedProps.some((prop) => node.deps.includes(prop)); | ||
if (!nodeHasDep && !isStatic) | ||
continue; | ||
const directiveHasDep = changedProps.some((prop) => directiveData.deps.includes(prop)); | ||
const isMaskDirective = directiveName === `${DIRECTIVE_PREFIX}mask`; | ||
const isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
const directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node, | ||
state, | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(`${DIRECTIVE_PREFIX}mask`); | ||
for (const [directiveName, directiveData] of Object.entries(node.directives)) { | ||
yield; | ||
const rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) | ||
continue; | ||
const directiveHasDep = changedProps.some((prop) => directiveData.deps.includes(prop)); | ||
const isMaskDirective = directiveName === `${DIRECTIVE_PREFIX}mask`; | ||
const isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
const directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node, | ||
state, | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(`${DIRECTIVE_PREFIX}mask`); | ||
} | ||
} | ||
@@ -277,3 +289,3 @@ } | ||
} | ||
} | ||
})(); | ||
}; | ||
@@ -413,3 +425,3 @@ | ||
else if (arrayDiff !== 0) { | ||
for (let i = Math.abs(arrayDiff); i > 0; i--) { | ||
for (let i = Math.abs(arrayDiff); i > 0; --i) { | ||
if (arrayDiff < 0) | ||
@@ -440,3 +452,3 @@ el.removeChild(el.lastChild); | ||
} | ||
render(compile(el, state), directives, state, node.deps); | ||
render(compile(el, state, true), directives, state, node.deps); | ||
}; | ||
@@ -474,12 +486,17 @@ | ||
set(target, key, value) { | ||
if (typeof state[key] === 'function') | ||
if (typeof state[key] === 'function' || key.startsWith('$')) | ||
return false; | ||
const hasArrayMutationKey = !isNaN(Number(key)) || key === 'length'; | ||
let props = [key]; | ||
const props = [key]; | ||
if (target instanceof Array && hasArrayMutationKey) { | ||
props = Object.keys(state).filter((prop) => arrayEquals(state[prop], target)); | ||
props.push(...Object.keys(state).filter((prop) => { | ||
return (state[prop] instanceof Array && | ||
arrayEquals(state[prop], target)); | ||
})); | ||
} | ||
else { | ||
if (Object.keys(state).some((prop) => target[prop] === undefined)) { | ||
props = Object.keys(state).filter((prop) => typeof state[prop] === 'object'); | ||
if (!Object.is(target, state)) { | ||
props.push(...Object.keys(state).filter((prop) => { | ||
return (typeof state[prop] === 'object' && JSON.stringify(state[prop]).indexOf(key) > -1); | ||
})); | ||
} | ||
@@ -513,2 +530,3 @@ } | ||
setElementCustomProp(rootEl, 'component', this); | ||
this.handleMutations(rootEl); | ||
return this.state; | ||
@@ -525,2 +543,17 @@ } | ||
} | ||
handleMutations(el) { | ||
const mutationObserver = new MutationObserver((mutationsList) => { | ||
for (const mutation of mutationsList) { | ||
const attrName = String(mutation.attributeName); | ||
if (mutation.type === 'attributes' && | ||
attrName.startsWith(DIRECTIVE_PREFIX) && | ||
attrName !== `${DIRECTIVE_PREFIX}for`) { | ||
this.ast = compile(el, this.state); | ||
this.render(); | ||
console.log('render'); | ||
} | ||
} | ||
}); | ||
mutationObserver.observe(el, { attributes: true, subtree: true }); | ||
} | ||
} | ||
@@ -527,0 +560,0 @@ const component = (state) => new Component(state); |
@@ -1,1 +0,1 @@ | ||
var t;!function(t){t["@"]="on",t[":"]="bind"}(t||(t={}));const e=t=>t.replace(/\s+/gim," ").trim();var s;!function(t){t[t.NULL=-1]="NULL",t[t.STATIC=0]="STATIC",t[t.DYNAMIC=1]="DYNAMIC"}(s||(s={}));const n=t=>new RegExp(`\\b${t}\\b`,"gim"),r=(t,e)=>t[e],o=(t,e,s)=>{t[e]=s},i=t=>[...new Set(t)],c=(t,e,s=!0,n={})=>{const r=`with($state){${s?`return ${t}`:t}}`;return(s,o)=>{try{const i=s[t];if(i)return"function"==typeof i?s[t]():i;{const t={$state:s,$el:e,$emit:(t,s,n=!0)=>{const r=new CustomEvent(t,s);(n?window:e||window).dispatchEvent(r)},$event:o,$refs:n};return new Function(...Object.keys(t),r)(...Object.values(t))}}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${t}"\nElement:`,e)}}},l=t=>t.hasAttribute("l-for"),a=(t,e)=>{const[r,o]=u(t,e),i=Object.keys(r).length>0,c=Object.values(r).some((({value:t})=>Object.keys(e).some((e=>n(e).test(t)))))?s.DYNAMIC:s.STATIC;return i?{el:t,deps:o,directives:r,type:c}:void 0},u=(e,s={})=>{const l={},a=(()=>{const t=document.querySelectorAll("[l-ref]"),e={};for(const s of t){const t=s.getAttribute("l-ref");t&&(e[t]=s)}return e})(),u=[];for(const{name:d,value:f}of e.attributes){const p="l-state"===d,h=d.startsWith("l-"),m=Object.keys(t).some((t=>d.startsWith(t)));if(p||!h&&!m)continue;const v=[],b=Object.keys(s);let y=!0;const g=b.filter((t=>{const e=n(t).test(String(f));if(e&&"function"==typeof s[t]){const e=b.filter((e=>n(e).test(String(s[t]))));v.push(...e)}return e}));/on|@/gim.test(d)&&(y=!1),d.includes("for")&&void 0===r(e,"__for_template")&&(o(e,"__for_template",String(e.innerHTML).trim()),y=!1);const A=i([...g,...v]);u.push(...A);const $={compute:c(f,e,y,a),deps:A,value:f};l[(h?d.slice("l-".length):`${t[d[0]]}:${d.slice(1)}`).toLowerCase()]=$}return[l,i(u)]},d=(t,e=!1,s=!1)=>{const n=[],r=l(t),o=!!(i=t).parentElement&&i.parentElement.hasAttribute("l-for");var i;if(!e&&(r||o))return n;if(s||e&&r||n.push(t),e||!r&&!o)for(const s of t.childNodes)if(s.nodeType===Node.ELEMENT_NODE)if(!e&&l(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...d(s,e))}return n},f=(e,s={},n=!1)=>{const o=[],i=void 0!==r(e,"component")&&l(e),c=d(e,i,n),u="l-mask";for(const e of c)if(e.hasAttribute(u)&&e.removeAttribute(u),new RegExp(`(l-|${Object.keys(t).join("|")})\\w+`,"gim").test(e.outerHTML)){const t=a(e,s);t&&o.push(t)}return o},p=(t,e,n={},r=[])=>{"string"==typeof r&&(r=[r]);const o=Object.keys(e);for(let i=0;i<t.length;i++){const c=t[i];if(c.type===s.NULL)continue;const l=c.type===s.STATIC;l&&(c.type=s.NULL);if(r.some((t=>c.deps.includes(t)))||l)for(const[t,s]of Object.entries(c.directives)){const i=t.split(/:|\./)[0];if(!o.includes(i.toUpperCase()))continue;const a=r.some((t=>s.deps.includes(t))),u="l-mask"===t,d=0===Object.keys(s.deps).length;if(a||l||d){const r={el:c.el,parts:t.split(/:|\./gim),data:s,node:c,state:n};v(r,e),(d||u)&&(delete c.directives[t],u&&c.el.removeAttribute("l-mask"))}}}},h=(t,e,s,n)=>{const r=[];for(const e of t)r.push(...e.deps);const o=i([...e,...r]);s.deps=o,s.directives[n].deps=o},m={BIND:({el:t,parts:s,data:n,state:r})=>{switch(s[1]){case"class":const o=n.compute(r);if("string"==typeof o)return t.setAttribute("class",e(`${t.className} ${o}`));if(o instanceof Array)return t.setAttribute("class",e(`${t.className} ${o.join(" ")}`));{const s=[];for(const t in o)o[t]&&s.push(t);const n=new RegExp(`\\b${Object.keys(o).join("|")}\\b`,"gim"),r=t.className.replace(n,"");if(s.length>0)return t.setAttribute("class",e(`${r} ${s.join(" ")}`));if(e(r).length>0)return t.setAttribute("class",e(r));if(t.hasAttribute("class"))return t.removeAttribute("class")}break;case"style":const i=n.compute(r);t.removeAttribute("style");for(const e in i)t.style[e]=i[e];break;default:const c=n.compute(r);if("object"==typeof c&&null!==c)for(const e in c)c[e]?t.setAttribute(e,c[e]):t.removeAttribute(e);else c?t.setAttribute(s[1],c):t.removeAttribute(s[1])}},HTML:({el:t,data:e,state:s,node:n})=>{var i;n=n;const c=r(t,"component");t.innerHTML=null!==(i=e.compute(s))&&void 0!==i?i:e.value;const l=f(t,s,!0);c||h(l,e.deps,n,"html"),p(l,m,s,e.deps),o(t,"component",!0)},MODEL:({el:t,parts:e,data:s,state:n})=>{const i=t,c=n[s.value],l="checkbox"===i.type?"checked":"value";if(i[l]!==String(c)&&(i[l]=c),!r(i,"__model_registered")){const t=()=>((t,e,s,n)=>{"checkbox"===t.type&&(t.value=String(t.checked));const r="number"==typeof e&&!isNaN(t.value),o="boolean"==typeof e&&("true"===t.value||"false"===t.value),i=null==e&&("null"===t.value||"undefined"===t.value);let c;return c=r?parseFloat(t.value):o?"true"===t.value:i?"null"===t.value?null:void 0:String(t.value),n[s.value]=c,c})(i,c,s,n);i.addEventListener("debounce"===e[1]?"change":"input",t),o(i,"__model_registered",!0)}},SHOW:({el:t,data:e,state:s})=>{t.style.display=e.compute(s)?"":"none",0===t.style.length&&t.removeAttribute("style")},ON:({el:t,parts:e,data:s,state:n})=>{const i={},c=e.slice(2);if(r(t,`__on_${e[1]}_registered`))return;const l=["outside","global"].some((t=>String(c).includes(t)))?window:t;i.once=c.includes("once"),i.passive=c.includes("passive"),l.addEventListener(e[1],(e=>{if(e instanceof KeyboardEvent&&/\d/gim.test(String(c))){const t=[];for(const e of c)isNaN(e)||t.push(Number(e));if(!t.includes(e.keyCode))return}if(c.includes("prevent")&&e.preventDefault(),c.includes("stop")&&e.stopPropagation(),!c.includes("self")||e.target===t){if(c.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}s.compute(n,e)}}),i),o(t,`__on_${e[1]}_registered`,!0)},TEXT:({el:t,data:e,state:s})=>{var n;t.textContent=null!==(n=e.compute(s))&&void 0!==n?n:e.value},FOR:({el:t,data:e,state:s,node:i})=>{var l;i=i;const a=r(t,"component");o(t,"component",!0);const[u,d]=e.value.split(/\s+(?:in|of)\s+/gim),[v,b]=null==u?void 0:u.trim().replace(/\(|\)/gim,"").split(","),y=null!==(l=s[null==d?void 0:d.trim()])&&void 0!==l?l:c(null==d?void 0:d.trim(),t,!0)(s),g=f(t,s);let A=r(t,"__for_template");t.innerHTML.trim()===A&&(t.innerHTML="");const $=(null==y?void 0:y.length)-t.children.length;if(0===(null==y?void 0:y.length))t.innerHTML="";else if(0!==$)for(let e=Math.abs($);e>0;e--)if($<0)t.removeChild(t.lastChild);else{const s=A.startsWith("<th")?"thead":A.startsWith("<td")||A.startsWith("<tr")?"tbody":"div",r=document.createElement(s);let o=A;v&&(o=o.replace(n(`this\\.${v.trim()}`),`${d}[${y.length-e}]`)),b&&(o=o.replace(n(`this\\.${b.trim()}`),String(y.length-e))),r.innerHTML=o,t.appendChild(r.firstElementChild)}a||(h(g,e.deps,i,"for"),t.removeAttribute("l-for")),p(f(t,s),m,s,i.deps)}},v=(t,e)=>{e[t.parts[0].toUpperCase()](t)},b=(t,e,s={})=>{const n={get:(t,e)=>"object"==typeof t[e]&&null!==t[e]?new Proxy(t[e],n):t[e],set(n,r,o){if("function"==typeof t[r])return!1;const i=!isNaN(Number(r))||"length"===r;let c=[r];n instanceof Array&&i?c=Object.keys(t).filter((e=>{return s=t[e],r=n,s instanceof Array&&r instanceof Array&&s.length===r.length&&s.every(((t,e)=>t===r[e]));var s,r})):Object.keys(t).some((t=>void 0===n[t]))&&(c=Object.keys(t).filter((e=>"object"==typeof t[e]))),n[r]=o,e(c);for(const[t,e]of Object.entries(s))c.includes(t)&&e();return!0}};return new Proxy(Object.seal(t),n)};class y{constructor(t={},e={},s={}){this.state=t,this.directives=e,this.watchers=s}mount(t){const e="string"==typeof t?document.querySelector(t):t;return this.ast=f(e,this.state),this.directives={...this.directives,...m},this.state=b({...this.state,$render:(t=Object.keys(this.state))=>this.render(t)},this.render.bind(this),this.watchers),this.render(),o(e,"component",this),this.state}directive(t,e){this.directives[t.toUpperCase()]=e}watch(t,e){this.watchers[t]=e}render(t=Object.keys(this.state)){p(this.ast,m,this.state,t)}}const g=t=>new y(t),A=(t=document)=>{const e="l-state",s=[...t.querySelectorAll("[l-state]")].filter((t=>void 0===r(t,"component")));for(const t of s){const s=t.getAttribute(e),n=c(`${s||"{}"}`,t,!0)({});g(n).mount(t)}};export{f as compile,g as component,c as computeExpression,m as directives,A as init,b as reactive,p as render}; | ||
var t;!function(t){t["@"]="on",t[":"]="bind"}(t||(t={}));const e=t=>t.replace(/\s+/gim," ").trim();var s;!function(t){t[t.NULL=-1]="NULL",t[t.STATIC=0]="STATIC",t[t.DYNAMIC=1]="DYNAMIC"}(s||(s={}));const n=t=>new RegExp(`\\b${t}\\b`,"gim"),r=(t,e)=>t[e],o=(t,e,s)=>{t[e]=s},i=t=>[...new Set(t)],c=(t,e,s=!0,n={})=>{const r=`with($state){${s?`return ${t}`:t}}`;return(s,o)=>{try{const i=s[t];if(i)return"function"==typeof i?s[t]():i;{const t={$state:s,$el:e,$emit:(t,s,n=!0)=>{const r=new CustomEvent(t,s);(n?window:e||window).dispatchEvent(r)},$event:o,$refs:n};return new Function(...Object.keys(t),r)(...Object.values(t))}}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${t}"\nElement:`,e)}}},l=t=>t.hasAttribute("l-for"),a=(t,e)=>{const[r,o]=u(t,e),i=Object.keys(r).length>0,c=Object.values(r).some((({value:t})=>Object.keys(e).some((e=>n(e).test(t)))))?s.DYNAMIC:s.STATIC;return i?{el:t,deps:o,directives:r,type:c}:void 0},u=(e,s={})=>{const l={},a=(()=>{const t=document.querySelectorAll("[l-ref]"),e={};for(const s of t){const t=s.getAttribute("l-ref");t&&(e[t]=s)}return e})(),u=[];for(const{name:d,value:f}of e.attributes){const p="l-state"===d,h=d.startsWith("l-"),m=Object.keys(t).some((t=>d.startsWith(t)));if(p||!h&&!m)continue;const v=[],b=Object.keys(s);let y=!0;const g=b.filter((t=>{const e=n(t).test(String(f));if(e&&"function"==typeof s[t]){const e=b.filter((e=>n(e).test(String(s[t]))));v.push(...e)}return e}));/on|@/gim.test(d)&&(y=!1),d.includes("for")&&void 0===r(e,"__for_template")&&(o(e,"__for_template",String(e.innerHTML).trim()),y=!1);const A=i([...g,...v]);u.push(...A);const $={compute:c(f,e,y,a),deps:A,value:f};l[(h?d.slice("l-".length):`${t[d[0]]}:${d.slice(1)}`).toLowerCase()]=$}return[l,i(u)]},d=(t,e=!1,s=!1)=>{const n=[],r=l(t),o=!!(i=t).parentElement&&i.parentElement.hasAttribute("l-for");var i;if(!e&&(r||o))return n;if(s||e&&r||n.push(t),e||!r&&!o)for(const s of t.childNodes)if(s.nodeType===Node.ELEMENT_NODE)if(!e&&l(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...d(s,e))}return n},f=(e,s={},n=!1)=>{const o=[],i=void 0!==r(e,"component")&&l(e),c=d(e,i,n),u="l-mask";for(const e of c)if(e.hasAttribute(u)&&e.removeAttribute(u),new RegExp(`(l-|${Object.keys(t).join("|")})\\w+`,"gim").test(e.outerHTML)){const t=a(e,s);t&&o.push(t)}return o},p=(t,e,n={},r=[])=>{const o=Object.keys(e);(t=>{const e=t();return function t(){const s=performance.now();let n=null;do{n=e.next()}while(performance.now()-s<25&&!n.done);n.done||setTimeout(t)}})((function*(){for(const i of t){const t=i.type===s.STATIC;t&&(i.type=s.NULL);if(r.some((t=>i.deps.includes(t)))||t)for(const[s,c]of Object.entries(i.directives)){yield;const l=s.split(/:|\./)[0];if(!o.includes(l.toUpperCase()))continue;const a=r.some((t=>c.deps.includes(t))),u="l-mask"===s,d=0===Object.keys(c.deps).length;if(a||t||d){const t={el:i.el,parts:s.split(/:|\./gim),data:c,node:i,state:n};v(t,e),(d||u)&&(delete i.directives[s],u&&i.el.removeAttribute("l-mask"))}}}}))()},h=(t,e,s,n)=>{const r=[];for(const e of t)r.push(...e.deps);const o=i([...e,...r]);s.deps=o,s.directives[n].deps=o},m={BIND:({el:t,parts:s,data:n,state:r})=>{switch(s[1]){case"class":const o=n.compute(r);if("string"==typeof o)return t.setAttribute("class",e(`${t.className} ${o}`));if(o instanceof Array)return t.setAttribute("class",e(`${t.className} ${o.join(" ")}`));{const s=[];for(const t in o)o[t]&&s.push(t);const n=new RegExp(`\\b${Object.keys(o).join("|")}\\b`,"gim"),r=t.className.replace(n,"");if(s.length>0)return t.setAttribute("class",e(`${r} ${s.join(" ")}`));if(e(r).length>0)return t.setAttribute("class",e(r));if(t.hasAttribute("class"))return t.removeAttribute("class")}break;case"style":const i=n.compute(r);t.removeAttribute("style");for(const e in i)t.style[e]=i[e];break;default:const c=n.compute(r);if("object"==typeof c&&null!==c)for(const e in c)c[e]?t.setAttribute(e,c[e]):t.removeAttribute(e);else c?t.setAttribute(s[1],c):t.removeAttribute(s[1])}},HTML:({el:t,data:e,state:s,node:n})=>{var i;n=n;const c=r(t,"component");t.innerHTML=null!==(i=e.compute(s))&&void 0!==i?i:e.value;const l=f(t,s,!0);c||h(l,e.deps,n,"html"),p(l,m,s,e.deps),o(t,"component",!0)},MODEL:({el:t,parts:e,data:s,state:n})=>{const i=t,c=n[s.value],l="checkbox"===i.type?"checked":"value";if(i[l]!==String(c)&&(i[l]=c),!r(i,"__model_registered")){const t=()=>((t,e,s,n)=>{"checkbox"===t.type&&(t.value=String(t.checked));const r="number"==typeof e&&!isNaN(t.value),o="boolean"==typeof e&&("true"===t.value||"false"===t.value),i=null==e&&("null"===t.value||"undefined"===t.value);let c;return c=r?parseFloat(t.value):o?"true"===t.value:i?"null"===t.value?null:void 0:String(t.value),n[s.value]=c,c})(i,c,s,n);i.addEventListener("debounce"===e[1]?"change":"input",t),o(i,"__model_registered",!0)}},SHOW:({el:t,data:e,state:s})=>{t.style.display=e.compute(s)?"":"none",0===t.style.length&&t.removeAttribute("style")},ON:({el:t,parts:e,data:s,state:n})=>{const i={},c=e.slice(2);if(r(t,`__on_${e[1]}_registered`))return;const l=["outside","global"].some((t=>String(c).includes(t)))?window:t;i.once=c.includes("once"),i.passive=c.includes("passive"),l.addEventListener(e[1],(e=>{if(e instanceof KeyboardEvent&&/\d/gim.test(String(c))){const t=[];for(const e of c)isNaN(e)||t.push(Number(e));if(!t.includes(e.keyCode))return}if(c.includes("prevent")&&e.preventDefault(),c.includes("stop")&&e.stopPropagation(),!c.includes("self")||e.target===t){if(c.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}s.compute(n,e)}}),i),o(t,`__on_${e[1]}_registered`,!0)},TEXT:({el:t,data:e,state:s})=>{var n;t.textContent=null!==(n=e.compute(s))&&void 0!==n?n:e.value},FOR:({el:t,data:e,state:s,node:i})=>{var l;i=i;const a=r(t,"component");o(t,"component",!0);const[u,d]=e.value.split(/\s+(?:in|of)\s+/gim),[v,b]=null==u?void 0:u.trim().replace(/\(|\)/gim,"").split(","),y=null!==(l=s[null==d?void 0:d.trim()])&&void 0!==l?l:c(null==d?void 0:d.trim(),t,!0)(s),g=f(t,s);let A=r(t,"__for_template");t.innerHTML.trim()===A&&(t.innerHTML="");const $=(null==y?void 0:y.length)-t.children.length;if(0===(null==y?void 0:y.length))t.innerHTML="";else if(0!==$)for(let e=Math.abs($);e>0;--e)if($<0)t.removeChild(t.lastChild);else{const s=A.startsWith("<th")?"thead":A.startsWith("<td")||A.startsWith("<tr")?"tbody":"div",r=document.createElement(s);let o=A;v&&(o=o.replace(n(`this\\.${v.trim()}`),`${d}[${y.length-e}]`)),b&&(o=o.replace(n(`this\\.${b.trim()}`),String(y.length-e))),r.innerHTML=o,t.appendChild(r.firstElementChild)}a||(h(g,e.deps,i,"for"),t.removeAttribute("l-for")),p(f(t,s,!0),m,s,i.deps)}},v=(t,e)=>{e[t.parts[0].toUpperCase()](t)},b=(t,e,s={})=>{const n={get:(t,e)=>"object"==typeof t[e]&&null!==t[e]?new Proxy(t[e],n):t[e],set(n,r,o){if("function"==typeof t[r]||r.startsWith("$"))return!1;const i=!isNaN(Number(r))||"length"===r,c=[r];n instanceof Array&&i?c.push(...Object.keys(t).filter((e=>{return t[e]instanceof Array&&(s=t[e],r=n,s instanceof Array&&r instanceof Array&&s.length===r.length&&s.every(((t,e)=>t===r[e])));var s,r}))):Object.is(n,t)||c.push(...Object.keys(t).filter((e=>"object"==typeof t[e]&&JSON.stringify(t[e]).indexOf(r)>-1))),n[r]=o,e(c);for(const[t,e]of Object.entries(s))c.includes(t)&&e();return!0}};return new Proxy(Object.seal(t),n)};class y{constructor(t={},e={},s={}){this.state=t,this.directives=e,this.watchers=s}mount(t){const e="string"==typeof t?document.querySelector(t):t;return this.ast=f(e,this.state),this.directives={...this.directives,...m},this.state=b({...this.state,$render:(t=Object.keys(this.state))=>this.render(t)},this.render.bind(this),this.watchers),this.render(),o(e,"component",this),this.handleMutations(e),this.state}directive(t,e){this.directives[t.toUpperCase()]=e}watch(t,e){this.watchers[t]=e}render(t=Object.keys(this.state)){p(this.ast,m,this.state,t)}handleMutations(t){new MutationObserver((e=>{for(const s of e){const e=String(s.attributeName);"attributes"===s.type&&e.startsWith("l-")&&"l-for"!==e&&(this.ast=f(t,this.state),this.render(),console.log("render"))}})).observe(t,{attributes:!0,subtree:!0})}}const g=t=>new y(t),A=(t=document)=>{const e="l-state",s=[...t.querySelectorAll("[l-state]")].filter((t=>void 0===r(t,"component")));for(const t of s){const s=t.getAttribute(e),n=c(`${s||"{}"}`,t,!0)({});g(n).mount(t)}};export{f as compile,g as component,c as computeExpression,m as directives,A as init,b as reactive,p as render}; |
@@ -241,36 +241,48 @@ var Lucia = (function () { | ||
const concurrent = (generatorFunction) => { | ||
const generator = generatorFunction(); | ||
return function next() { | ||
const start = performance.now(); | ||
let task = null; | ||
do { | ||
task = generator.next(); | ||
} while (performance.now() - start < 25 && !task.done); | ||
if (task.done) | ||
return; | ||
setTimeout(next); | ||
}; | ||
}; | ||
const render = (ast, directives, state = {}, changedProps = []) => { | ||
if (typeof changedProps === 'string') | ||
changedProps = [changedProps]; | ||
const legalDirectiveNames = Object.keys(directives); | ||
for (let i = 0; i < ast.length; i++) { | ||
const node = ast[i]; | ||
if (node.type === ASTNodeType.NULL) | ||
continue; | ||
const isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) | ||
node.type = ASTNodeType.NULL; | ||
const nodeHasDep = changedProps.some((prop) => node.deps.includes(prop)); | ||
if (!nodeHasDep && !isStatic) | ||
continue; | ||
for (const [directiveName, directiveData] of Object.entries(node.directives)) { | ||
const rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) | ||
concurrent(function* () { | ||
for (const node of ast) { | ||
const isStatic = node.type === ASTNodeType.STATIC; | ||
if (isStatic) | ||
node.type = ASTNodeType.NULL; | ||
const nodeHasDep = changedProps.some((prop) => node.deps.includes(prop)); | ||
if (!nodeHasDep && !isStatic) | ||
continue; | ||
const directiveHasDep = changedProps.some((prop) => directiveData.deps.includes(prop)); | ||
const isMaskDirective = directiveName === `${DIRECTIVE_PREFIX}mask`; | ||
const isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
const directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node, | ||
state, | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(`${DIRECTIVE_PREFIX}mask`); | ||
for (const [directiveName, directiveData] of Object.entries(node.directives)) { | ||
yield; | ||
const rawDirectiveName = directiveName.split(/:|\./)[0]; | ||
if (!legalDirectiveNames.includes(rawDirectiveName.toUpperCase())) | ||
continue; | ||
const directiveHasDep = changedProps.some((prop) => directiveData.deps.includes(prop)); | ||
const isMaskDirective = directiveName === `${DIRECTIVE_PREFIX}mask`; | ||
const isStaticDirective = Object.keys(directiveData.deps).length === 0; | ||
if (directiveHasDep || isStatic || isStaticDirective) { | ||
const directiveProps = { | ||
el: node.el, | ||
parts: directiveName.split(rawDirectiveSplitRE()), | ||
data: directiveData, | ||
node, | ||
state, | ||
}; | ||
renderDirective(directiveProps, directives); | ||
if (isStaticDirective || isMaskDirective) { | ||
delete node.directives[directiveName]; | ||
if (isMaskDirective) { | ||
node.el.removeAttribute(`${DIRECTIVE_PREFIX}mask`); | ||
} | ||
} | ||
@@ -280,3 +292,3 @@ } | ||
} | ||
} | ||
})(); | ||
}; | ||
@@ -416,3 +428,3 @@ | ||
else if (arrayDiff !== 0) { | ||
for (let i = Math.abs(arrayDiff); i > 0; i--) { | ||
for (let i = Math.abs(arrayDiff); i > 0; --i) { | ||
if (arrayDiff < 0) | ||
@@ -443,3 +455,3 @@ el.removeChild(el.lastChild); | ||
} | ||
render(compile(el, state), directives, state, node.deps); | ||
render(compile(el, state, true), directives, state, node.deps); | ||
}; | ||
@@ -477,12 +489,17 @@ | ||
set(target, key, value) { | ||
if (typeof state[key] === 'function') | ||
if (typeof state[key] === 'function' || key.startsWith('$')) | ||
return false; | ||
const hasArrayMutationKey = !isNaN(Number(key)) || key === 'length'; | ||
let props = [key]; | ||
const props = [key]; | ||
if (target instanceof Array && hasArrayMutationKey) { | ||
props = Object.keys(state).filter((prop) => arrayEquals(state[prop], target)); | ||
props.push(...Object.keys(state).filter((prop) => { | ||
return (state[prop] instanceof Array && | ||
arrayEquals(state[prop], target)); | ||
})); | ||
} | ||
else { | ||
if (Object.keys(state).some((prop) => target[prop] === undefined)) { | ||
props = Object.keys(state).filter((prop) => typeof state[prop] === 'object'); | ||
if (!Object.is(target, state)) { | ||
props.push(...Object.keys(state).filter((prop) => { | ||
return (typeof state[prop] === 'object' && JSON.stringify(state[prop]).indexOf(key) > -1); | ||
})); | ||
} | ||
@@ -516,2 +533,3 @@ } | ||
setElementCustomProp(rootEl, 'component', this); | ||
this.handleMutations(rootEl); | ||
return this.state; | ||
@@ -528,2 +546,17 @@ } | ||
} | ||
handleMutations(el) { | ||
const mutationObserver = new MutationObserver((mutationsList) => { | ||
for (const mutation of mutationsList) { | ||
const attrName = String(mutation.attributeName); | ||
if (mutation.type === 'attributes' && | ||
attrName.startsWith(DIRECTIVE_PREFIX) && | ||
attrName !== `${DIRECTIVE_PREFIX}for`) { | ||
this.ast = compile(el, this.state); | ||
this.render(); | ||
console.log('render'); | ||
} | ||
} | ||
}); | ||
mutationObserver.observe(el, { attributes: true, subtree: true }); | ||
} | ||
} | ||
@@ -557,5 +590,5 @@ const component = (state) => new Component(state); | ||
document.addEventListener('DOMContentLoaded', () => { | ||
const customLuciaInit = window.customLuciaInit; | ||
if (customLuciaInit) { | ||
customLuciaInit(init); | ||
const init$1 = window.LuciaInit; | ||
if (init$1) { | ||
init$1(init); | ||
} | ||
@@ -562,0 +595,0 @@ else { |
@@ -1,1 +0,1 @@ | ||
var Lucia=function(){"use strict";const t="l-";var e;!function(t){t["@"]="on",t[":"]="bind"}(e||(e={}));const s=t=>t.replace(/\s+/gim," ").trim();var n;!function(t){t[t.NULL=-1]="NULL",t[t.STATIC=0]="STATIC",t[t.DYNAMIC=1]="DYNAMIC"}(n||(n={}));const o=t=>new RegExp(`\\b${t}\\b`,"gim"),r=(t,e)=>t[e],i=(t,e,s)=>{t[e]=s},c=t=>[...new Set(t)],l=(t,e,s=!0,n={})=>{const o=`with($state){${s?`return ${t}`:t}}`;return(s,r)=>{try{const i=s[t];if(i)return"function"==typeof i?s[t]():i;{const t={$state:s,$el:e,$emit:(t,s,n=!0)=>{const o=new CustomEvent(t,s);(n?window:e||window).dispatchEvent(o)},$event:r,$refs:n};return new Function(...Object.keys(t),o)(...Object.values(t))}}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${t}"\nElement:`,e)}}},a=t=>t.hasAttribute("l-for"),u=(t,e)=>{const[s,r]=d(t,e),i=Object.keys(s).length>0,c=Object.values(s).some((({value:t})=>Object.keys(e).some((e=>o(e).test(t)))))?n.DYNAMIC:n.STATIC;return i?{el:t,deps:r,directives:s,type:c}:void 0},d=(s,n={})=>{const a={},u=(()=>{const t=document.querySelectorAll("[l-ref]"),e={};for(const s of t){const t=s.getAttribute("l-ref");t&&(e[t]=s)}return e})(),d=[];for(const{name:f,value:p}of s.attributes){const h="l-state"===f,m=f.startsWith(t),v=Object.keys(e).some((t=>f.startsWith(t)));if(h||!m&&!v)continue;const b=[],y=Object.keys(n);let g=!0;const A=y.filter((t=>{const e=o(t).test(String(p));if(e&&"function"==typeof n[t]){const e=y.filter((e=>o(e).test(String(n[t]))));b.push(...e)}return e}));/on|@/gim.test(f)&&(g=!1),f.includes("for")&&void 0===r(s,"__for_template")&&(i(s,"__for_template",String(s.innerHTML).trim()),g=!1);const $=c([...A,...b]);d.push(...$);const _={compute:l(p,s,g,u),deps:$,value:p};a[(m?f.slice(t.length):`${e[f[0]]}:${f.slice(1)}`).toLowerCase()]=_}return[a,c(d)]},f=(t,e=!1,s=!1)=>{const n=[],o=a(t),r=!!(i=t).parentElement&&i.parentElement.hasAttribute("l-for");var i;if(!e&&(o||r))return n;if(s||e&&o||n.push(t),e||!o&&!r)for(const s of t.childNodes)if(s.nodeType===Node.ELEMENT_NODE)if(!e&&a(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...f(s,e))}return n},p=(t,s={},n=!1)=>{const o=[],i=void 0!==r(t,"component")&&a(t),c=f(t,i,n),l="l-mask";for(const t of c)if(t.hasAttribute(l)&&t.removeAttribute(l),new RegExp(`(l-|${Object.keys(e).join("|")})\\w+`,"gim").test(t.outerHTML)){const e=u(t,s);e&&o.push(e)}return o},h=(t,e,s={},o=[])=>{"string"==typeof o&&(o=[o]);const r=Object.keys(e);for(let i=0;i<t.length;i++){const c=t[i];if(c.type===n.NULL)continue;const l=c.type===n.STATIC;l&&(c.type=n.NULL);if(o.some((t=>c.deps.includes(t)))||l)for(const[t,n]of Object.entries(c.directives)){const i=t.split(/:|\./)[0];if(!r.includes(i.toUpperCase()))continue;const a=o.some((t=>n.deps.includes(t))),u="l-mask"===t,d=0===Object.keys(n.deps).length;if(a||l||d){const o={el:c.el,parts:t.split(/:|\./gim),data:n,node:c,state:s};b(o,e),(d||u)&&(delete c.directives[t],u&&c.el.removeAttribute("l-mask"))}}}},m=(t,e,s,n)=>{const o=[];for(const e of t)o.push(...e.deps);const r=c([...e,...o]);s.deps=r,s.directives[n].deps=r},v={BIND:({el:t,parts:e,data:n,state:o})=>{switch(e[1]){case"class":const r=n.compute(o);if("string"==typeof r)return t.setAttribute("class",s(`${t.className} ${r}`));if(r instanceof Array)return t.setAttribute("class",s(`${t.className} ${r.join(" ")}`));{const e=[];for(const t in r)r[t]&&e.push(t);const n=new RegExp(`\\b${Object.keys(r).join("|")}\\b`,"gim"),o=t.className.replace(n,"");if(e.length>0)return t.setAttribute("class",s(`${o} ${e.join(" ")}`));if(s(o).length>0)return t.setAttribute("class",s(o));if(t.hasAttribute("class"))return t.removeAttribute("class")}break;case"style":const i=n.compute(o);t.removeAttribute("style");for(const e in i)t.style[e]=i[e];break;default:const c=n.compute(o);if("object"==typeof c&&null!==c)for(const e in c)c[e]?t.setAttribute(e,c[e]):t.removeAttribute(e);else c?t.setAttribute(e[1],c):t.removeAttribute(e[1])}},HTML:({el:t,data:e,state:s,node:n})=>{var o;n=n;const c=r(t,"component");t.innerHTML=null!==(o=e.compute(s))&&void 0!==o?o:e.value;const l=p(t,s,!0);c||m(l,e.deps,n,"html"),h(l,v,s,e.deps),i(t,"component",!0)},MODEL:({el:t,parts:e,data:s,state:n})=>{const o=t,c=n[s.value],l="checkbox"===o.type?"checked":"value";if(o[l]!==String(c)&&(o[l]=c),!r(o,"__model_registered")){const t=()=>((t,e,s,n)=>{"checkbox"===t.type&&(t.value=String(t.checked));const o="number"==typeof e&&!isNaN(t.value),r="boolean"==typeof e&&("true"===t.value||"false"===t.value),i=null==e&&("null"===t.value||"undefined"===t.value);let c;return c=o?parseFloat(t.value):r?"true"===t.value:i?"null"===t.value?null:void 0:String(t.value),n[s.value]=c,c})(o,c,s,n);o.addEventListener("debounce"===e[1]?"change":"input",t),i(o,"__model_registered",!0)}},SHOW:({el:t,data:e,state:s})=>{t.style.display=e.compute(s)?"":"none",0===t.style.length&&t.removeAttribute("style")},ON:({el:t,parts:e,data:s,state:n})=>{const o={},c=e.slice(2);if(r(t,`__on_${e[1]}_registered`))return;const l=["outside","global"].some((t=>String(c).includes(t)))?window:t;o.once=c.includes("once"),o.passive=c.includes("passive"),l.addEventListener(e[1],(e=>{if(e instanceof KeyboardEvent&&/\d/gim.test(String(c))){const t=[];for(const e of c)isNaN(e)||t.push(Number(e));if(!t.includes(e.keyCode))return}if(c.includes("prevent")&&e.preventDefault(),c.includes("stop")&&e.stopPropagation(),!c.includes("self")||e.target===t){if(c.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}s.compute(n,e)}}),o),i(t,`__on_${e[1]}_registered`,!0)},TEXT:({el:t,data:e,state:s})=>{var n;t.textContent=null!==(n=e.compute(s))&&void 0!==n?n:e.value},FOR:({el:t,data:e,state:s,node:n})=>{var c;n=n;const a=r(t,"component");i(t,"component",!0);const[u,d]=e.value.split(/\s+(?:in|of)\s+/gim),[f,b]=null==u?void 0:u.trim().replace(/\(|\)/gim,"").split(","),y=null!==(c=s[null==d?void 0:d.trim()])&&void 0!==c?c:l(null==d?void 0:d.trim(),t,!0)(s),g=p(t,s);let A=r(t,"__for_template");t.innerHTML.trim()===A&&(t.innerHTML="");const $=(null==y?void 0:y.length)-t.children.length;if(0===(null==y?void 0:y.length))t.innerHTML="";else if(0!==$)for(let e=Math.abs($);e>0;e--)if($<0)t.removeChild(t.lastChild);else{const s=A.startsWith("<th")?"thead":A.startsWith("<td")||A.startsWith("<tr")?"tbody":"div",n=document.createElement(s);let r=A;f&&(r=r.replace(o(`this\\.${f.trim()}`),`${d}[${y.length-e}]`)),b&&(r=r.replace(o(`this\\.${b.trim()}`),String(y.length-e))),n.innerHTML=r,t.appendChild(n.firstElementChild)}a||(m(g,e.deps,n,"for"),t.removeAttribute("l-for")),h(p(t,s),v,s,n.deps)}},b=(t,e)=>{e[t.parts[0].toUpperCase()](t)},y=(t,e,s={})=>{const n={get:(t,e)=>"object"==typeof t[e]&&null!==t[e]?new Proxy(t[e],n):t[e],set(n,o,r){if("function"==typeof t[o])return!1;const i=!isNaN(Number(o))||"length"===o;let c=[o];n instanceof Array&&i?c=Object.keys(t).filter((e=>{return s=t[e],o=n,s instanceof Array&&o instanceof Array&&s.length===o.length&&s.every(((t,e)=>t===o[e]));var s,o})):Object.keys(t).some((t=>void 0===n[t]))&&(c=Object.keys(t).filter((e=>"object"==typeof t[e]))),n[o]=r,e(c);for(const[t,e]of Object.entries(s))c.includes(t)&&e();return!0}};return new Proxy(Object.seal(t),n)};class g{constructor(t={},e={},s={}){this.state=t,this.directives=e,this.watchers=s}mount(t){const e="string"==typeof t?document.querySelector(t):t;return this.ast=p(e,this.state),this.directives={...this.directives,...v},this.state=y({...this.state,$render:(t=Object.keys(this.state))=>this.render(t)},this.render.bind(this),this.watchers),this.render(),i(e,"component",this),this.state}directive(t,e){this.directives[t.toUpperCase()]=e}watch(t,e){this.watchers[t]=e}render(t=Object.keys(this.state)){h(this.ast,v,this.state,t)}}const A=t=>new g(t),$=(t=document)=>{const e="l-state",s=[...t.querySelectorAll("[l-state]")].filter((t=>void 0===r(t,"component")));for(const t of s){const s=t.getAttribute(e),n=l(`${s||"{}"}`,t,!0)({});A(n).mount(t)}};var _=Object.freeze({__proto__:null,component:A,compile:p,render:h,reactive:y,directives:v,computeExpression:l,init:$});return"loading"===document.readyState&&document.addEventListener("DOMContentLoaded",(()=>{const t=window.customLuciaInit;t?t($):$()})),_}(); | ||
var Lucia=function(){"use strict";const t="l-";var e;!function(t){t["@"]="on",t[":"]="bind"}(e||(e={}));const s=t=>t.replace(/\s+/gim," ").trim();var n;!function(t){t[t.NULL=-1]="NULL",t[t.STATIC=0]="STATIC",t[t.DYNAMIC=1]="DYNAMIC"}(n||(n={}));const r=t=>new RegExp(`\\b${t}\\b`,"gim"),o=(t,e)=>t[e],i=(t,e,s)=>{t[e]=s},c=t=>[...new Set(t)],l=(t,e,s=!0,n={})=>{const r=`with($state){${s?`return ${t}`:t}}`;return(s,o)=>{try{const i=s[t];if(i)return"function"==typeof i?s[t]():i;{const t={$state:s,$el:e,$emit:(t,s,n=!0)=>{const r=new CustomEvent(t,s);(n?window:e||window).dispatchEvent(r)},$event:o,$refs:n};return new Function(...Object.keys(t),r)(...Object.values(t))}}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${t}"\nElement:`,e)}}},a=t=>t.hasAttribute("l-for"),u=(t,e)=>{const[s,o]=d(t,e),i=Object.keys(s).length>0,c=Object.values(s).some((({value:t})=>Object.keys(e).some((e=>r(e).test(t)))))?n.DYNAMIC:n.STATIC;return i?{el:t,deps:o,directives:s,type:c}:void 0},d=(s,n={})=>{const a={},u=(()=>{const t=document.querySelectorAll("[l-ref]"),e={};for(const s of t){const t=s.getAttribute("l-ref");t&&(e[t]=s)}return e})(),d=[];for(const{name:f,value:p}of s.attributes){const h="l-state"===f,m=f.startsWith(t),v=Object.keys(e).some((t=>f.startsWith(t)));if(h||!m&&!v)continue;const b=[],y=Object.keys(n);let g=!0;const A=y.filter((t=>{const e=r(t).test(String(p));if(e&&"function"==typeof n[t]){const e=y.filter((e=>r(e).test(String(n[t]))));b.push(...e)}return e}));/on|@/gim.test(f)&&(g=!1),f.includes("for")&&void 0===o(s,"__for_template")&&(i(s,"__for_template",String(s.innerHTML).trim()),g=!1);const w=c([...A,...b]);d.push(...w);const $={compute:l(p,s,g,u),deps:w,value:p};a[(m?f.slice(t.length):`${e[f[0]]}:${f.slice(1)}`).toLowerCase()]=$}return[a,c(d)]},f=(t,e=!1,s=!1)=>{const n=[],r=a(t),o=!!(i=t).parentElement&&i.parentElement.hasAttribute("l-for");var i;if(!e&&(r||o))return n;if(s||e&&r||n.push(t),e||!r&&!o)for(const s of t.childNodes)if(s.nodeType===Node.ELEMENT_NODE)if(!e&&a(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...f(s,e))}return n},p=(t,s={},n=!1)=>{const r=[],i=void 0!==o(t,"component")&&a(t),c=f(t,i,n),l="l-mask";for(const t of c)if(t.hasAttribute(l)&&t.removeAttribute(l),new RegExp(`(l-|${Object.keys(e).join("|")})\\w+`,"gim").test(t.outerHTML)){const e=u(t,s);e&&r.push(e)}return r},h=(t,e,s={},r=[])=>{const o=Object.keys(e);(t=>{const e=t();return function t(){const s=performance.now();let n=null;do{n=e.next()}while(performance.now()-s<25&&!n.done);n.done||setTimeout(t)}})((function*(){for(const i of t){const t=i.type===n.STATIC;t&&(i.type=n.NULL);if(r.some((t=>i.deps.includes(t)))||t)for(const[n,c]of Object.entries(i.directives)){yield;const l=n.split(/:|\./)[0];if(!o.includes(l.toUpperCase()))continue;const a=r.some((t=>c.deps.includes(t))),u="l-mask"===n,d=0===Object.keys(c.deps).length;if(a||t||d){const t={el:i.el,parts:n.split(/:|\./gim),data:c,node:i,state:s};b(t,e),(d||u)&&(delete i.directives[n],u&&i.el.removeAttribute("l-mask"))}}}}))()},m=(t,e,s,n)=>{const r=[];for(const e of t)r.push(...e.deps);const o=c([...e,...r]);s.deps=o,s.directives[n].deps=o},v={BIND:({el:t,parts:e,data:n,state:r})=>{switch(e[1]){case"class":const o=n.compute(r);if("string"==typeof o)return t.setAttribute("class",s(`${t.className} ${o}`));if(o instanceof Array)return t.setAttribute("class",s(`${t.className} ${o.join(" ")}`));{const e=[];for(const t in o)o[t]&&e.push(t);const n=new RegExp(`\\b${Object.keys(o).join("|")}\\b`,"gim"),r=t.className.replace(n,"");if(e.length>0)return t.setAttribute("class",s(`${r} ${e.join(" ")}`));if(s(r).length>0)return t.setAttribute("class",s(r));if(t.hasAttribute("class"))return t.removeAttribute("class")}break;case"style":const i=n.compute(r);t.removeAttribute("style");for(const e in i)t.style[e]=i[e];break;default:const c=n.compute(r);if("object"==typeof c&&null!==c)for(const e in c)c[e]?t.setAttribute(e,c[e]):t.removeAttribute(e);else c?t.setAttribute(e[1],c):t.removeAttribute(e[1])}},HTML:({el:t,data:e,state:s,node:n})=>{var r;n=n;const c=o(t,"component");t.innerHTML=null!==(r=e.compute(s))&&void 0!==r?r:e.value;const l=p(t,s,!0);c||m(l,e.deps,n,"html"),h(l,v,s,e.deps),i(t,"component",!0)},MODEL:({el:t,parts:e,data:s,state:n})=>{const r=t,c=n[s.value],l="checkbox"===r.type?"checked":"value";if(r[l]!==String(c)&&(r[l]=c),!o(r,"__model_registered")){const t=()=>((t,e,s,n)=>{"checkbox"===t.type&&(t.value=String(t.checked));const r="number"==typeof e&&!isNaN(t.value),o="boolean"==typeof e&&("true"===t.value||"false"===t.value),i=null==e&&("null"===t.value||"undefined"===t.value);let c;return c=r?parseFloat(t.value):o?"true"===t.value:i?"null"===t.value?null:void 0:String(t.value),n[s.value]=c,c})(r,c,s,n);r.addEventListener("debounce"===e[1]?"change":"input",t),i(r,"__model_registered",!0)}},SHOW:({el:t,data:e,state:s})=>{t.style.display=e.compute(s)?"":"none",0===t.style.length&&t.removeAttribute("style")},ON:({el:t,parts:e,data:s,state:n})=>{const r={},c=e.slice(2);if(o(t,`__on_${e[1]}_registered`))return;const l=["outside","global"].some((t=>String(c).includes(t)))?window:t;r.once=c.includes("once"),r.passive=c.includes("passive"),l.addEventListener(e[1],(e=>{if(e instanceof KeyboardEvent&&/\d/gim.test(String(c))){const t=[];for(const e of c)isNaN(e)||t.push(Number(e));if(!t.includes(e.keyCode))return}if(c.includes("prevent")&&e.preventDefault(),c.includes("stop")&&e.stopPropagation(),!c.includes("self")||e.target===t){if(c.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}s.compute(n,e)}}),r),i(t,`__on_${e[1]}_registered`,!0)},TEXT:({el:t,data:e,state:s})=>{var n;t.textContent=null!==(n=e.compute(s))&&void 0!==n?n:e.value},FOR:({el:t,data:e,state:s,node:n})=>{var c;n=n;const a=o(t,"component");i(t,"component",!0);const[u,d]=e.value.split(/\s+(?:in|of)\s+/gim),[f,b]=null==u?void 0:u.trim().replace(/\(|\)/gim,"").split(","),y=null!==(c=s[null==d?void 0:d.trim()])&&void 0!==c?c:l(null==d?void 0:d.trim(),t,!0)(s),g=p(t,s);let A=o(t,"__for_template");t.innerHTML.trim()===A&&(t.innerHTML="");const w=(null==y?void 0:y.length)-t.children.length;if(0===(null==y?void 0:y.length))t.innerHTML="";else if(0!==w)for(let e=Math.abs(w);e>0;--e)if(w<0)t.removeChild(t.lastChild);else{const s=A.startsWith("<th")?"thead":A.startsWith("<td")||A.startsWith("<tr")?"tbody":"div",n=document.createElement(s);let o=A;f&&(o=o.replace(r(`this\\.${f.trim()}`),`${d}[${y.length-e}]`)),b&&(o=o.replace(r(`this\\.${b.trim()}`),String(y.length-e))),n.innerHTML=o,t.appendChild(n.firstElementChild)}a||(m(g,e.deps,n,"for"),t.removeAttribute("l-for")),h(p(t,s,!0),v,s,n.deps)}},b=(t,e)=>{e[t.parts[0].toUpperCase()](t)},y=(t,e,s={})=>{const n={get:(t,e)=>"object"==typeof t[e]&&null!==t[e]?new Proxy(t[e],n):t[e],set(n,r,o){if("function"==typeof t[r]||r.startsWith("$"))return!1;const i=!isNaN(Number(r))||"length"===r,c=[r];n instanceof Array&&i?c.push(...Object.keys(t).filter((e=>{return t[e]instanceof Array&&(s=t[e],r=n,s instanceof Array&&r instanceof Array&&s.length===r.length&&s.every(((t,e)=>t===r[e])));var s,r}))):Object.is(n,t)||c.push(...Object.keys(t).filter((e=>"object"==typeof t[e]&&JSON.stringify(t[e]).indexOf(r)>-1))),n[r]=o,e(c);for(const[t,e]of Object.entries(s))c.includes(t)&&e();return!0}};return new Proxy(Object.seal(t),n)};class g{constructor(t={},e={},s={}){this.state=t,this.directives=e,this.watchers=s}mount(t){const e="string"==typeof t?document.querySelector(t):t;return this.ast=p(e,this.state),this.directives={...this.directives,...v},this.state=y({...this.state,$render:(t=Object.keys(this.state))=>this.render(t)},this.render.bind(this),this.watchers),this.render(),i(e,"component",this),this.handleMutations(e),this.state}directive(t,e){this.directives[t.toUpperCase()]=e}watch(t,e){this.watchers[t]=e}render(t=Object.keys(this.state)){h(this.ast,v,this.state,t)}handleMutations(e){new MutationObserver((s=>{for(const n of s){const s=String(n.attributeName);"attributes"===n.type&&s.startsWith(t)&&"l-for"!==s&&(this.ast=p(e,this.state),this.render(),console.log("render"))}})).observe(e,{attributes:!0,subtree:!0})}}const A=t=>new g(t),w=(t=document)=>{const e="l-state",s=[...t.querySelectorAll("[l-state]")].filter((t=>void 0===o(t,"component")));for(const t of s){const s=t.getAttribute(e),n=l(`${s||"{}"}`,t,!0)({});A(n).mount(t)}};var $=Object.freeze({__proto__:null,component:A,compile:p,render:h,reactive:y,directives:v,computeExpression:l,init:w});return"loading"===document.readyState&&document.addEventListener("DOMContentLoaded",(()=>{const t=window.LuciaInit;t?t(w):w()})),$}(); |
@@ -12,4 +12,5 @@ import { Directives, DirectiveProps, Watchers, State, ASTNode } from './models/structs'; | ||
render(props?: string[]): void; | ||
handleMutations(el: HTMLElement): void; | ||
} | ||
export declare const component: (state?: Record<string, unknown> | undefined) => Component; | ||
export declare const component: (state?: import("./models/generics").UnknownKV | undefined) => Component; | ||
export default component; |
import { UnknownKV } from '../models/generics'; | ||
import { Directives, ASTNode } from '../models/structs'; | ||
declare const render: (ast: ASTNode[], directives: Directives, state?: UnknownKV, changedProps?: string | string[]) => void; | ||
declare const render: (ast: ASTNode[], directives: Directives, state?: UnknownKV, changedProps?: string[]) => void; | ||
export default render; |
{ | ||
"name": "lucia", | ||
"version": "0.4.7", | ||
"version": "0.5.0", | ||
"description": "3kb library for tiny web apps", | ||
@@ -10,7 +10,8 @@ "main": "dist/lucia.cjs.js", | ||
"scripts": { | ||
"dev": "npx rollup -c rollup-dev.config.js -w", | ||
"dev": "npx esbuild src/browser.ts --bundle --watch --sourcemap --outfile=dist/lucia.js", | ||
"build": "npx del-cli dist/ && npx rollup -c", | ||
"test": "npx jest --coverage --silent", | ||
"cleanup": "npx prettier -w src", | ||
"coverage": "cat ./coverage/lcov.info | coveralls" | ||
"test": "jest --coverage --silent", | ||
"cleanup": "prettier --write src --parser typescript", | ||
"coverage": "cat ./coverage/lcov.info | coveralls", | ||
"prepublishOnly": "npm run build" | ||
}, | ||
@@ -52,10 +53,13 @@ "repository": { | ||
"@rollup/plugin-babel": "^5.2.2", | ||
"@rollup/plugin-commonjs": "17.1.0", | ||
"@rollup/plugin-commonjs": "18.0.0", | ||
"@rollup/plugin-node-resolve": "11.2.0", | ||
"@testing-library/dom": "^7.28.1", | ||
"@types/jest": "^26.0.22", | ||
"coveralls": "^3.1.0", | ||
"del-cli": "^3.0.1", | ||
"esbuild": "^0.11.1", | ||
"jest": "^26.6.1", | ||
"prettier": "^2.1.2", | ||
"rollup": "2.41.1", | ||
"rollup": "2.44.0", | ||
"rollup-plugin-filesize": "^9.1.1", | ||
"rollup-plugin-terser": "^7.0.2", | ||
@@ -62,0 +66,0 @@ "rollup-plugin-typescript2": "^0.30.0", |
@@ -42,2 +42,8 @@ # <a href="http://lucia.js.org"><img src="https://raw.githubusercontent.com/aidenybai/lucia/master/.github/img/logo.svg" height="60" alt="Lucia Logo" aria-label="http://lucia.js.org" /></a> | ||
## Sponsors | ||
<a href="https://anomaly-science.com/" target="_blank"><img width="20%" src="https://raw.githubusercontent.com/Anomaly-Science/assets/main/SVG/Anomaly%20Science%20Logo%20Full%20Light%20Mode.svg" alt="Anomaly Science"></a> | ||
**Want your logo here? [→ Sponsor Lucia](https://github.com/sponsors/aidenybai)** | ||
## Resources & Contributing Back | ||
@@ -57,10 +63,8 @@ | ||
Lucia is [MIT-licensed](LICENSE.md) open-source software by [Aiden Bai](https://github.com/aidenybai), [et al](https://github.com/aidenybai/lucia/graphs/contributors). | ||
Lucia is [MIT-licensed](LICENSE.md) open-source software by [Aiden Bai](https://github.com/aidenybai) [et al.](https://github.com/aidenybai/lucia/graphs/contributors) | ||
Lucia takes heavy inspiration from [Vue's syntax](https://github.com/vuejs/vue), and believes in the core philosophies and values behind [Alpine](https://github.com/alpinejs/alpine), [Sidewind](https://github.com/survivejs/sidewind), and [Remake](https://github.com/remake/remake-cli). Feel free to check them out if you interested in a production-ready library to use. | ||
[![HN Post](https://hackerbadge.now.sh/api?id=24887968&type=light)](https://news.ycombinator.com/item?id=24887968) | ||
--- | ||
© 2020 The Lucia Authors. | ||
© 2020-present The Lucia Authors. |
261427
37
4848
69
19