New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

lucia

Package Overview
Dependencies
Maintainers
1
Versions
109
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

lucia - npm Package Compare versions

Comparing version 0.5.1 to 0.5.2

dist/types/core/utils/log.d.ts

202

dist/legacy/lucia.cjs.js

@@ -113,38 +113,17 @@ 'use strict';

var rawDirectiveSplitRE = function rawDirectiveSplitRE() {
return /:|\./gim;
};
var eventDirectivePrefixRE = function eventDirectivePrefixRE() {
return /on|@/gim;
};
var parenthesisWrapReplaceRE = function parenthesisWrapReplaceRE() {
return /\(|\)/gim;
};
var hasDirectiveRE = function hasDirectiveRE() {
return new RegExp("(" + DIRECTIVE_PREFIX + "|" + Object.keys(DIRECTIVE_SHORTHANDS).join('|') + ")\\w+", 'gim');
};
var expressionPropRE = function expressionPropRE(prop) {
return new RegExp("\\b" + prop + "\\b", 'gim');
};
var error = function error(err, expression, el) {
var message = "Lucia Error: \"" + err + "\"";
var resolveStateInExpression = function resolveStateInExpression(unresolvedExpression, deps) {
if (deps === void 0) {
deps = [];
if (expression) {
message += "\n\nExpression: \"" + expression + "\"";
}
var expression = unresolvedExpression;
var _a = deps;
if (el) {
message += "\nElement:";
}
var _f = function _f(dep) {
if (dep !== expression) {
expression = expression.replace(expressionPropRE(dep), "$state." + dep);
}
};
console.warn(message, el);
};
for (var _i = 0; _i < _a.length; _i++) {
_f(_a[_i]);
}
return expression;
};
var computeExpression = function computeExpression(expression, el, returnable, refs, deps) {
var computeExpression = function computeExpression(expression, el, returnable, refs) {
if (returnable === void 0) {

@@ -159,6 +138,8 @@ returnable = true;

var formattedExpression = "" + (returnable ? "return " + expression : expression);
var resolvedExpression = resolveStateInExpression(formattedExpression, deps);
var specialPropertiesNames = ['$state', '$el', '$emit', '$event', '$refs'];
var computeFunction = new Function("'use strict';return function(" + specialPropertiesNames.join(',') + "){" + resolvedExpression + "}")();
var customGlobalSpecialProperties = window.LuciaSpecialProperties || {};
var specialPropertiesNames = __spreadArray(['$state', '$el', '$emit', '$event', '$refs'], __read(Object.keys(customGlobalSpecialProperties)));
var computeFunction = new Function("return function(" + specialPropertiesNames.join(',') + "){with($state){" + formattedExpression + "}}")();
var emit = function emit(name, options, dispatchGlobal) {

@@ -181,6 +162,6 @@ if (dispatchGlobal === void 0) {

} else {
return computeFunction(state, el, emit, event, refs);
return computeFunction.apply(void 0, __spreadArray([state, el, emit, event, refs], __read(Object.values(customGlobalSpecialProperties))));
}
} catch (err) {
console.warn("Lucia Error: \"" + err + "\"\n\nExpression: \"" + expression + "\"\nElement:", el);
error(err, expression, el);
}

@@ -190,8 +171,17 @@ };

var getElementCustomProp = function getElementCustomProp(el, prop) {
return el[prop];
var rawDirectiveSplitRE = function rawDirectiveSplitRE() {
return /:|\./gim;
};
var setElementCustomProp = function setElementCustomProp(el, prop, value) {
el[prop] = value;
var eventDirectivePrefixRE = function eventDirectivePrefixRE() {
return /on|@/gim;
};
var parenthesisWrapReplaceRE = function parenthesisWrapReplaceRE() {
return /\(|\)/gim;
};
var hasDirectiveRE = function hasDirectiveRE() {
return new RegExp("(" + DIRECTIVE_PREFIX + "|" + Object.keys(DIRECTIVE_SHORTHANDS).join('|') + ")\\w+", 'gim');
};
var expressionPropRE = function expressionPropRE(prop) {
return new RegExp("\\b" + prop + "\\b", 'gim');
};

@@ -290,4 +280,4 @@ var removeDupesFromArray = function removeDupesFromArray(array) {

if (name_1.includes('for') && getElementCustomProp(el, FOR_TEMPLATE_FLAG) === undefined) {
setElementCustomProp(el, FOR_TEMPLATE_FLAG, String(el.innerHTML).trim());
if (name_1.includes('for') && el[FOR_TEMPLATE_FLAG] === undefined) {
el[FOR_TEMPLATE_FLAG] = String(el.innerHTML).trim();
returnable = false;

@@ -299,3 +289,3 @@ }

var directiveData = {
compute: computeExpression(value, el, returnable, refs, uniqueCompiledDeps),
compute: computeExpression(value, el, returnable, refs),
deps: uniqueCompiledDeps,

@@ -403,3 +393,3 @@ value: value

var ast = [];
var isListGroup = getElementCustomProp(el, COMPONENT_FLAG) !== undefined && isListRenderScope(el);
var isListGroup = el[COMPONENT_FLAG] !== undefined && isListRenderScope(el);
var elements = flattenElementChildren(el, isListGroup, ignoreRootElement);

@@ -459,7 +449,9 @@ var maskDirective = DIRECTIVE_PREFIX + "mask";

var classes = data.compute(state);
var removeDynamicClassesRE = new RegExp("\\b" + Object.keys(classes).join('|') + "\\b", 'gim');
var rawClasses = el.className.replace(removeDynamicClassesRE, '');
if (typeof classes === 'string') {
return el.setAttribute('class', formatAcceptableWhitespace(el.className + " " + classes));
el.className = formatAcceptableWhitespace(rawClasses + " " + classes);
} else if (Array.isArray(classes)) {
return el.setAttribute('class', formatAcceptableWhitespace(el.className + " " + classes.join(' ')));
el.className = formatAcceptableWhitespace(rawClasses + " " + classes.join(' '));
} else {

@@ -483,11 +475,9 @@ var activeClasses_1 = [];

}
var removeDynamicClassesRE = new RegExp("\\b" + Object.keys(classes).join('|') + "\\b", 'gim');
var rawClasses = el.className.replace(removeDynamicClassesRE, '');
if (activeClasses_1.length > 0) {
return el.setAttribute('class', formatAcceptableWhitespace(rawClasses + " " + activeClasses_1.join(' ')));
el.className = formatAcceptableWhitespace(rawClasses + " " + activeClasses_1.join(' '));
} else if (formatAcceptableWhitespace(rawClasses).length > 0) {
return el.setAttribute('class', formatAcceptableWhitespace(rawClasses));
} else if (el.hasAttribute('class')) {
return el.removeAttribute('class');
el.className = formatAcceptableWhitespace(rawClasses);
} else {
el.className = '';
}

@@ -809,6 +799,6 @@ }

node = _a.node;
var originalAST = getElementCustomProp(el, COMPONENT_FLAG);
var originalAST = el[COMPONENT_FLAG];
if (!originalAST) {
setElementCustomProp(el, COMPONENT_FLAG, compile(el, state));
el[COMPONENT_FLAG] = compile(el, state);
}

@@ -827,3 +817,3 @@

var currArray = (_b = state[target === null || target === void 0 ? void 0 : target.trim()]) !== null && _b !== void 0 ? _b : computeExpression(target === null || target === void 0 ? void 0 : target.trim(), el, true)(state);
var template = getElementCustomProp(el, FOR_TEMPLATE_FLAG);
var template = el[FOR_TEMPLATE_FLAG];

@@ -863,7 +853,7 @@ if (el.innerHTML.trim() === template) {

setElementCustomProp(el, COMPONENT_FLAG, compile(el, state));
el[COMPONENT_FLAG] = compile(el, state);
}
if (!originalAST) {
adjustDeps(getElementCustomProp(el, COMPONENT_FLAG), data.deps, node, 'for');
adjustDeps(el[COMPONENT_FLAG], data.deps, node, 'for');
el.removeAttribute(DIRECTIVE_PREFIX + "for");

@@ -884,3 +874,3 @@ }

node = node;
var marker = getElementCustomProp(el, COMPONENT_FLAG);
var marker = el[COMPONENT_FLAG];
var ret = (_b = data.compute(state)) !== null && _b !== void 0 ? _b : data.value;

@@ -899,3 +889,3 @@

render(ast, directives, state, data.deps);
setElementCustomProp(el, COMPONENT_FLAG, ast);
el[COMPONENT_FLAG] = ast;
}

@@ -951,3 +941,3 @@ }

if (!getElementCustomProp(el, MODEL_REGISTERED_FLAG)) {
if (!el[MODEL_REGISTERED_FLAG]) {
var callback = function callback() {

@@ -958,3 +948,3 @@ return inputCallback(el, hydratedValue, data, state);

el.addEventListener(parts[1] === 'debounce' ? 'change' : 'input', callback);
setElementCustomProp(el, MODEL_REGISTERED_FLAG, true);
el[MODEL_REGISTERED_FLAG] = true;
}

@@ -971,4 +961,5 @@ };

var eventProps = parts.slice(2);
var EVENT_REGISTERED_FLAG = "__on_" + parts[1] + "_registered";
if (getElementCustomProp(el, "__on_" + parts[1] + "_registered")) {
if (el[EVENT_REGISTERED_FLAG]) {
return;

@@ -1031,3 +1022,3 @@ }

target.addEventListener(parts[1], handler, options);
setElementCustomProp(el, "__on_" + parts[1] + "_registered", true);
el[EVENT_REGISTERED_FLAG] = true;
};

@@ -1063,3 +1054,4 @@

var directives = {
var customGlobalDirectives = window.LuciaDirectives || {};
var directives = __assign({
BIND: bindDirective,

@@ -1072,3 +1064,3 @@ HTML: htmlDirective,

FOR: forDirective
};
}, customGlobalDirectives);
var renderDirective = function renderDirective(props, directives) {

@@ -1088,2 +1080,15 @@ directives[props.parts[0].toUpperCase()](props);

var _a2 = ['Object', 'Array'];
var _f = function _f(type) {
return "[object " + type + "]";
};
var _r = [];
for (var _i = 0; _i < _a2.length; _i++) {
_r.push(_f(_a2[_i]));
}
var supportedObjectTypes = _r;
var handler = {

@@ -1094,3 +1099,10 @@ get: function get(target, key) {

if (_typeof(ret) === 'object' && ret !== null) {
return new Proxy(ret, handler);
var objectType = Object.prototype.toString.call(ret);
if (supportedObjectTypes.includes(objectType)) {
return new Proxy(ret, handler);
} else {
error("Data type " + objectType + " is not supported");
return ret;
}
} else {

@@ -1121,5 +1133,5 @@ return ret;

var _a2 = Object.entries(watchers);
var _a3 = Object.entries(watchers);
var _f = function _f(_a) {
var _f2 = function _f2(_a) {
var _b = __read(_a, 2),

@@ -1134,4 +1146,4 @@ prop = _b[0],

for (var _i = 0; _i < _a2.length; _i++) {
_f(_a2[_i]);
for (var _i2 = 0; _i2 < _a3.length; _i2++) {
_f2(_a3[_i2]);
}

@@ -1175,3 +1187,3 @@ return true;

this.render();
setElementCustomProp(rootEl, COMPONENT_FLAG, this);
rootEl[COMPONENT_FLAG] = this;
var mountedEvent = new CustomEvent('mounted');

@@ -1182,6 +1194,2 @@ rootEl.dispatchEvent(mountedEvent);

Component.prototype.directive = function (name, callback) {
this.directives[name.toUpperCase()] = callback;
};
Component.prototype.watch = function (name, callback) {

@@ -1211,15 +1219,38 @@ this.watchers[name] = callback;

var stateDirective = DIRECTIVE_PREFIX + "state";
var componentElements = element.querySelectorAll("[" + stateDirective + "]");
var tagDirective = DIRECTIVE_PREFIX + "tag";
var componentElements = element.querySelectorAll("[" + stateDirective + "], [" + tagDirective + "]");
var uninitializedComponents = __spreadArray([], __read(componentElements)).filter(function (el) {
return getElementCustomProp(el, COMPONENT_FLAG) === undefined;
return el[COMPONENT_FLAG] === undefined;
});
var needsReInit = false;
var _a = uninitializedComponents;
var _f = function _f(uninitializedComponent) {
var stateExpression = uninitializedComponent.getAttribute(stateDirective);
var state = new Function("return " + stateExpression)() || {};
var currentComponent = component(state);
currentComponent.mount(uninitializedComponent);
if (uninitializedComponent.hasAttribute(tagDirective)) {
var tag = uninitializedComponent.getAttribute(tagDirective);
var customComponents = __spreadArray([], __read(element.querySelectorAll(tag)));
var realElement_1 = uninitializedComponent.content.firstElementChild;
var _a2 = customComponents;
var _f2 = function _f2(customComponent) {
customComponent.replaceWith(realElement_1.cloneNode(true));
};
for (var _i2 = 0; _i2 < _a2.length; _i2++) {
_f2(_a2[_i2], _i2, _a2);
}
if (customComponents.length > 0) {
needsReInit = true;
}
} else {
var stateExpression = uninitializedComponent.getAttribute(stateDirective);
var state = new Function("return " + stateExpression)() || {};
var currentComponent = component(state);
currentComponent.mount(uninitializedComponent);
}
};

@@ -1230,10 +1261,9 @@

}
if (needsReInit) {
init(element);
}
};
exports.compile = compile;
exports.component = component;
exports.computeExpression = computeExpression;
exports.directives = directives;
exports.init = init;
exports.reactive = reactive;
exports.render = render;

2

dist/legacy/lucia.cjs.min.js

@@ -1,1 +0,1 @@

"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:u(0),throw:u(1),return:u(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function u(o){return function(u){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,u])}}}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;!function(e){e["@"]="on",e[":"]="bind"}(o||(o={})),function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(a||(a={}));var u=function(){return new RegExp("(l-|"+Object.keys(o).join("|")+")\\w+","gim")},s=function(e){return new RegExp("\\b"+e+"\\b","gim")},l=function(e,t,r,n,i){void 0===r&&(r=!0),void 0===n&&(n={});var o=function(e,t){void 0===t&&(t=[]);for(var r,n=e,i=t,o=0;o<i.length;o++)(r=i[o])!==n&&(n=n.replace(s(r),"$state."+r));return n}(""+(r?"return "+e:e),i),a=new Function("'use strict';return function("+["$state","$el","$emit","$event","$refs"].join(",")+"){"+o+"}")(),u=function(e,r,n){void 0===n&&(n=!0);var i=new CustomEvent(e,r);(n?window:t||window).dispatchEvent(i)};return function(r,i){try{var o=r[e];return o?"function"==typeof o?o.bind(r)():o:a(r,t,u,i,n)}catch(r){console.warn('Lucia Error: "'+r+'"\n\nExpression: "'+e+'"\nElement:',t)}}},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){return e.hasAttribute("l-for")},p=function(e,t){var a,u;void 0===t&&(t={});var d={},p=function(){for(var e,t,r="l-ref",n=document.querySelectorAll("[l-ref]"),i={},o=n,a=0;a<o.length;a++)e=o[a],t=void 0,(t=e.getAttribute(r))&&(i[t]=e);return i}(),h=[],y=function(r,a){var u="l-state"===r,y=r.startsWith("l-"),b=Object.keys(o).some((function(e){return r.startsWith(e)}));if(u||!y&&!b)return"continue";var m=[],g=Object.keys(t),w=!0,A=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 x=v(i(i([],n(A)),n(m)));h.push.apply(h,i([],n(x)));var S={compute:l(a,e,w,p,x),deps:x,value:a},j=y?r.slice("l-".length):o[r[0]]+":"+r.slice(1);d[j.toLowerCase()]=S};try{for(var b=r(e.attributes),m=b.next();!m.done;m=b.next()){var g=m.value;y(g.name,g.value)}}catch(e){a={error:e}}finally{try{m&&!m.done&&(u=b.return)&&u.call(b)}finally{if(a)throw a.error}}return[d,v(h)]},h=function e(t,o,a){var u,s;void 0===o&&(o=!1),void 0===a&&(a=!1);var l,c=[],f=d(t),v=!!(l=t).parentElement&&l.parentElement.hasAttribute("l-for");if(!o&&(f||v))return c;if(a||o&&f||c.push(t),o||!f&&!v)try{for(var p=r(t.children),h=p.next();!h.done;h=p.next()){var y=h.value;if(y instanceof HTMLElement)if(!o&&d(y))c.push(y);else{if(y.hasAttribute("l-state"))continue;c.push.apply(c,i([],n(e(y,o,0===y.attributes.length))))}}}catch(e){u={error:e}}finally{try{h&&!h.done&&(s=p.return)&&s.call(p)}finally{if(u)throw u.error}}return c},y=function(e,t,r){void 0===t&&(t={}),void 0===r&&(r=!1);for(var i=[],o=void 0!==c(e,"component")&&d(e),l=h(e,o,r),f="l-mask",v=l,y=function(e){if(e.hasAttribute(f)&&e.removeAttribute(f),u().test(e.outerHTML)){var r=function(e,t){var r=n(p(e,t),2),i=r[0],o=r[1],u=Object.keys(i).length>0,l=Object.values(i).some((function(e){var r=e.value;return Object.keys(t).some((function(e){return s(e).test(r)}))}))?a.DYNAMIC:a.STATIC;return u?{el:e,deps:o,directives:i,type:l}:void 0}(e,t);r&&i.push(r)}},b=0;b<v.length;b++)y(v[b]);return i};function b(e){return(b="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)}var m=function(e){return e.replace(/\s+/gim," ").trim()},g=function(e,i,o,u){void 0===o&&(o={}),void 0===u&&(u=[]);var s,l,c=Object.keys(i);(s=25,l=function(){var s,l,f,v,d,p,h;return t(this,(function(y){switch(y.label){case 0:s=function(e){var s,l,f,v,d,p,h,y,b,m,g;return t(this,(function(w){switch(w.label){case 0:return e.type===a.NULL?[2,"continue"]:((s=e.type===a.STATIC)&&(e.type=a.NULL),[4]);case 1:if(w.sent(),!u.some((function(t){return e.deps.includes(t)}))&&!s)return[2,"continue"];l=function(r,n){var a,l,f,v,d;return t(this,(function(t){switch(t.label){case 0:return a=r.split(/:|\./gim)[0],c.includes(a.toUpperCase())?[4]:[2,"continue"];case 1:return t.sent(),l=u.some((function(e){return n.deps.includes(e)})),f="l-mask"===r,v=0===Object.keys(n.deps).length,(l||s||v)&&(d={el:e.el,parts:r.split(/:|\./gim),data:n,node:e,state:o},x(d,i),(v||f)&&(delete e.directives[r],f&&e.el.removeAttribute("l-mask"))),[2]}}))},w.label=2;case 2:w.trys.push([2,7,8,9]),m=void 0,f=r(Object.entries(e.directives)),v=f.next(),w.label=3;case 3:return v.done?[3,6]:(d=n(v.value,2),p=d[0],h=d[1],[5,l(p,h)]);case 4:w.sent(),w.label=5;case 5:return v=f.next(),[3,3];case 6:return[3,9];case 7:return y=w.sent(),m={error:y},[3,9];case 8:try{v&&!v.done&&(g=f.return)&&g.call(f)}finally{if(m)throw m.error}return[7];case 9:return e.directives["on:effect"]&&(b=new CustomEvent("effect"),e.el.dispatchEvent(b)),[2]}}))},y.label=1;case 1:y.trys.push([1,6,7,8]),l=r(e),f=l.next(),y.label=2;case 2:return f.done?[3,5]:(v=f.value,[5,s(v)]);case 3:y.sent(),y.label=4;case 4:return f=l.next(),[3,2];case 5:return[3,8];case 6:return d=y.sent(),p={error:d},[3,8];case 7:try{f&&!f.done&&(h=l.return)&&h.call(l)}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<s&&!r.done);r.done||setTimeout(e)})()},w=function(e,t,r,o){for(var a=[],u=e,s=function(e){a.push.apply(a,i([],n(e.deps)))},l=0;l<u.length;l++)s(u[l]);var c=v(i(i([],n(t)),n(a)));r.deps=c,r.directives[o].deps=c},A={BIND:function(e){var t=e.el,r=e.parts,i=e.data,o=e.state;switch(r[1]){case"class":var a=i.compute(o);if("string"==typeof a)return t.setAttribute("class",m(t.className+" "+a));if(Array.isArray(a))return t.setAttribute("class",m(t.className+" "+a.join(" ")));for(var u=[],s=Object.entries(a),l=function(e){var t=n(e,2),r=t[0];t[1]&&u.push(r)},c=0;c<s.length;c++)l(s[c]);var f=new RegExp("\\b"+Object.keys(a).join("|")+"\\b","gim"),v=t.className.replace(f,"");if(u.length>0)return t.setAttribute("class",m(v+" "+u.join(" ")));if(m(v).length>0)return t.setAttribute("class",m(v));if(t.hasAttribute("class"))return t.removeAttribute("class");break;case"style":var d=i.compute(o);t.hasAttribute("style")&&t.removeAttribute("style");for(var p=Object.entries(d),h=function(e){var r=n(e,2),i=r[0],o=r[1];t.style[i]=o},y=0;y<p.length;y++)h(p[y]);break;default:var g=i.compute(o);if("object"===b(g)&&null!==g)for(var w=Object.entries(g),A=function(e){var r=n(e,2),i=r[0],o=r[1];o?t.setAttribute(i,o):t.removeAttribute(i)},x=0;x<w.length;x++)A(w[x]);else g?t.setAttribute(r[1],g):t.hasAttribute(r[1])&&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"),s=null!==(t=n.compute(i))&&void 0!==t?t:n.value;if(s!==r.innerHTML&&(r.innerHTML=s,u().test(s))){var l=null!=a?a:y(r,i,!0);a||w(l,n.deps,o,"html"),g(l,A,i,n.deps),f(r,"component",l)}},MODEL:function(e){var t,r=e.el,n=e.parts,i=e.data,o=e.state,a=r,u=null!==(t=o[i.value])&&void 0!==t?t:l(i.value,a,!0)(o),s="checkbox"===a.type?"checked":"value";if(a[s]!==String(u)&&(a[s]=u),!c(a,"__model_registered")){a.addEventListener("debounce"===n[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),u=null==t&&("null"===e.value||"undefined"===e.value);return i=o?Number(e.value):a?"true"===e.value:u?"null"===e.value?null:void 0:String(e.value),n[r.value]?n[r.value]=i:(i="string"==typeof i?"'"+i+"'":i,l("$state."+r.value+" = "+i,e,!0)(n)),i}(a,u,i,o)})),f(a,"__model_registered",!0)}},SHOW:function(e){var t=e.el,r=e.data,n=e.state,i=r.compute(n);i!==t.style.display&&(t.style.display=i?"":"none"),0===t.style.length&&t.removeAttribute("style")},ON:function(e){var t=e.el,r=e.parts,n=e.data,i=e.state,o={},a=r.slice(2);if(!c(t,"__on_"+r[1]+"_registered")){var u=["outside","global"].some((function(e){return String(a).includes(e)}))?window:t;o.once=a.includes("once"),o.passive=a.includes("passive"),u.addEventListener(r[1],(function(e){if(e instanceof KeyboardEvent&&/\d/gim.test(String(a))){for(var r=[],o=a,u=0;u<o.length;u++)s=o[u],isNaN(s)||r.push(Number(s));if(!r.includes(e.keyCode))return}var s;if(a.includes("prevent")&&e.preventDefault(),a.includes("stop")&&e.stopPropagation(),!a.includes("self")||e.target===t){if(a.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}n.compute(i,e)}}),o),f(t,"__on_"+r[1]+"_registered",!0)}},TEXT:function(e){var t,r=e.el,n=e.data,i=e.state,o=null!==(t=n.compute(i))&&void 0!==t?t:n.value;o!==r.textContent&&(r.textContent=o)},FOR:function(e){var t,r=e.el,i=e.data,o=e.state,a=e.node,u=c(r,"component");u||f(r,"component",y(r,o));var v=n(i.value.split(/\s+(?:in|of)\s+/gim),2),d=v[0],p=v[1],h=n(null==d?void 0:d.trim().replace(/\(|\)/gim,"").split(","),2),b=h[0],m=h[1],x=null!==(t=o[null==p?void 0:p.trim()])&&void 0!==t?t:l(null==p?void 0:p.trim(),r,!0)(o),S=c(r,"__for_template");r.innerHTML.trim()===S&&(r.innerHTML="");var j=(null==x?void 0:x.length)-r.children.length;if(0===(null==x?void 0:x.length))r.innerHTML="";else if(0!==j){for(var O=Math.abs(j);O>0;--O)if(j<0)r.removeChild(r.lastChild);else{var k=String(S),E=/^[^\S]*?<(t(?:head|body|foot|r|d|h))/i.test(k);b&&(k=k.replace(s("this\\."+b.trim()),p+"["+(x.length-O)+"]")),m&&(k=k.replace(s("this\\."+m.trim()),String(x.length-O))),E&&(k="<table>"+k+"</table>");var _=document.createRange().createContextualFragment(k);r.appendChild(E?_.firstElementChild.firstElementChild:_)}f(r,"component",y(r,o))}u||(w(c(r,"component"),i.deps,a,"for"),r.removeAttribute("l-for"));var C=0===j?u:y(r,o,!0);g(C||[],A,o,a.deps)}},x=function(e,t){t[e.parts[0].toUpperCase()](e)},S=function(e,t,r){void 0===r&&(r={});var o={get:function(e,t){var r=e[t];return"object"===b(r)&&null!==r?new Proxy(r,o):r},set:function(o,a,u){var s=!isNaN(Number(a))||"length"===a,l=s?[]:[a];if(Array.isArray(o)&&s){var c=Object.keys(e).filter((function(t){return Array.isArray(e[t])&&(r=e[t],n=o,Array.isArray(r)&&Array.isArray(n)&&r.length===n.length&&r.every((function(e,t){return e===n[t]})));var r,n}));l.push.apply(l,i([],n(c)))}else if(!Object.is(o,e)){c=Object.keys(e).filter((function(t){return"[object Object]"===Object.prototype.toString.call(e[t])&&JSON.stringify(e[t]).indexOf(a)>-1}));l.push.apply(l,i([],n(c)))}o[a]=u,t(l);for(var f,v,d,p,h=Object.entries(r),y=0;y<h.length;y++)f=h[y],v=void 0,d=void 0,p=void 0,v=n(f,2),d=v[0],p=v[1],l.includes(d)&&p();return!0}};return new Proxy(Object.seal(e),o)},j=function(){function t(e,t,r){void 0===e&&(e={}),void 0===t&&(t={}),void 0===r&&(r={}),this.ast=[],this.state=e,this.directives=t,this.watchers=r}return t.prototype.mount=function(t){var r="string"==typeof t?document.querySelector(t)||document.body:t,n=e(e({},this.state),{$render:this.render.bind(this)});this.ast=y(r,this.state),this.directives=e(e({},this.directives),A),this.state=S(n,this.render.bind(this),this.watchers),this.render(),f(r,"component",this);var i=new CustomEvent("mounted");return r.dispatchEvent(i),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,A,this.state,e)},t}(),O=function(e){return new j(e)};exports.compile=y,exports.component=O,exports.computeExpression=l,exports.directives=A,exports.init=function(e){void 0===e&&(e=document);for(var t,r,o,a="l-state",u=i([],n(e.querySelectorAll("[l-state]"))).filter((function(e){return void 0===c(e,"component")})),s=0;s<u.length;s++)t=u[s],r=void 0,o=void 0,r=t.getAttribute(a),o=new Function("return "+r)()||{},O(o).mount(t)},exports.reactive=S,exports.render=g;
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=function(){return(e=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};function t(e,t){var n,r,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(n)throw new TypeError("Generator is already executing.");for(;a;)try{if(n=1,r&&(i=2&o[0]?r.return:o[0]?r.throw||((i=r.return)&&i.call(r),0):r.next)&&!(i=i.call(r,o[1])).done)return i;switch(r=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++,r=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],r=0}finally{n=i=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,l])}}}function n(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],r=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&r>=e.length&&(e=void 0),{value:e&&e[r++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function r(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var r,i,o=n.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(r=o.next()).done;)a.push(r.value)}catch(e){i={error:e}}finally{try{r&&!r.done&&(n=o.return)&&n.call(o)}finally{if(i)throw i.error}}return a}function i(e,t){for(var n=0,r=t.length,i=e.length;n<r;n++,i++)e[i]=t[n];return e}var o,a;!function(e){e["@"]="on",e[":"]="bind"}(o||(o={})),function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(a||(a={}));var l=function(e,t,n){var r='Lucia Error: "'+e+'"';t&&(r+='\n\nExpression: "'+t+'"'),n&&(r+="\nElement:"),console.warn(r,n)},u=function(e,t,n,o){void 0===n&&(n=!0),void 0===o&&(o={});var a=""+(n?"return "+e:e),u=window.LuciaSpecialProperties||{},s=i(["$state","$el","$emit","$event","$refs"],r(Object.keys(u))),c=new Function("return function("+s.join(",")+"){with($state){"+a+"}}")(),f=function(e,n,r){void 0===r&&(r=!0);var i=new CustomEvent(e,n);(r?window:t||window).dispatchEvent(i)};return function(n,a){try{var s=n[e];return s?"function"==typeof s?s.bind(n)():s:c.apply(void 0,i([n,t,f,a,o],r(Object.values(u))))}catch(n){l(n,e,t)}}},s=function(){return new RegExp("(l-|"+Object.keys(o).join("|")+")\\w+","gim")},c=function(e){return new RegExp("\\b"+e+"\\b","gim")},f=function(e){return i([],r(new Set(e)))},v=function(e){return e.hasAttribute("l-for")},d=function(e,t){var a,l;void 0===t&&(t={});var s={},v=function(){for(var e,t,n="l-ref",r=document.querySelectorAll("[l-ref]"),i={},o=r,a=0;a<o.length;a++)e=o[a],t=void 0,(t=e.getAttribute(n))&&(i[t]=e);return i}(),d=[],p=function(n,a){var l="l-state"===n,p=n.startsWith("l-"),h=Object.keys(o).some((function(e){return n.startsWith(e)}));if(l||!p&&!h)return"continue";var y=[],b=Object.keys(t),m=!0,g=b.filter((function(e){var n=c(e).test(String(a));if(n&&"function"==typeof t[e]){var o=b.filter((function(n){return c(n).test(String(t[e]))}));y.push.apply(y,i([],r(o)))}return n}));/on|@/gim.test(n)&&(m=!1),n.includes("for")&&void 0===e.__for_template&&(e.__for_template=String(e.innerHTML).trim(),m=!1);var w=f(i(i([],r(g)),r(y)));d.push.apply(d,i([],r(w)));var A={compute:u(a,e,m,v),deps:w,value:a},j=p?n.slice("l-".length):o[n[0]]+":"+n.slice(1);s[j.toLowerCase()]=A};try{for(var h=n(e.attributes),y=h.next();!y.done;y=h.next()){var b=y.value;p(b.name,b.value)}}catch(e){a={error:e}}finally{try{y&&!y.done&&(l=h.return)&&l.call(h)}finally{if(a)throw a.error}}return[s,f(d)]},p=function e(t,o,a){var l,u;void 0===o&&(o=!1),void 0===a&&(a=!1);var s,c=[],f=v(t),d=!!(s=t).parentElement&&s.parentElement.hasAttribute("l-for");if(!o&&(f||d))return c;if(a||o&&f||c.push(t),o||!f&&!d)try{for(var p=n(t.children),h=p.next();!h.done;h=p.next()){var y=h.value;if(y instanceof HTMLElement)if(!o&&v(y))c.push(y);else{if(y.hasAttribute("l-state"))continue;c.push.apply(c,i([],r(e(y,o,0===y.attributes.length))))}}}catch(e){l={error:e}}finally{try{h&&!h.done&&(u=p.return)&&u.call(p)}finally{if(l)throw l.error}}return c},h=function(e,t,n){void 0===t&&(t={}),void 0===n&&(n=!1);for(var i=[],o=void 0!==e.component&&v(e),l=p(e,o,n),u="l-mask",f=l,h=function(e){if(e.hasAttribute(u)&&e.removeAttribute(u),s().test(e.outerHTML)){var n=function(e,t){var n=r(d(e,t),2),i=n[0],o=n[1],l=Object.keys(i).length>0,u=Object.values(i).some((function(e){var n=e.value;return Object.keys(t).some((function(e){return c(e).test(n)}))}))?a.DYNAMIC:a.STATIC;return l?{el:e,deps:o,directives:i,type:u}:void 0}(e,t);n&&i.push(n)}},y=0;y<f.length;y++)h(f[y]);return i};function y(e){return(y="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)}var b=function(e){return e.replace(/\s+/gim," ").trim()},m=function(e,i,o,l){void 0===o&&(o={}),void 0===l&&(l=[]);var u,s,c=Object.keys(i);(u=25,s=function(){var u,s,f,v,d,p,h;return t(this,(function(y){switch(y.label){case 0:u=function(e){var u,s,f,v,d,p,h,y,b,m,g;return t(this,(function(w){switch(w.label){case 0:return e.type===a.NULL?[2,"continue"]:((u=e.type===a.STATIC)&&(e.type=a.NULL),[4]);case 1:if(w.sent(),!l.some((function(t){return e.deps.includes(t)}))&&!u)return[2,"continue"];s=function(n,r){var a,s,f,v,d;return t(this,(function(t){switch(t.label){case 0:return a=n.split(/:|\./gim)[0],c.includes(a.toUpperCase())?[4]:[2,"continue"];case 1:return t.sent(),s=l.some((function(e){return r.deps.includes(e)})),f="l-mask"===n,v=0===Object.keys(r.deps).length,(s||u||v)&&(d={el:e.el,parts:n.split(/:|\./gim),data:r,node:e,state:o},j(d,i),(v||f)&&(delete e.directives[n],f&&e.el.removeAttribute("l-mask"))),[2]}}))},w.label=2;case 2:w.trys.push([2,7,8,9]),m=void 0,f=n(Object.entries(e.directives)),v=f.next(),w.label=3;case 3:return v.done?[3,6]:(d=r(v.value,2),p=d[0],h=d[1],[5,s(p,h)]);case 4:w.sent(),w.label=5;case 5:return v=f.next(),[3,3];case 6:return[3,9];case 7:return y=w.sent(),m={error:y},[3,9];case 8:try{v&&!v.done&&(g=f.return)&&g.call(f)}finally{if(m)throw m.error}return[7];case 9:return e.directives["on:effect"]&&(b=new CustomEvent("effect"),e.el.dispatchEvent(b)),[2]}}))},y.label=1;case 1:y.trys.push([1,6,7,8]),s=n(e),f=s.next(),y.label=2;case 2:return f.done?[3,5]:(v=f.value,[5,u(v)]);case 3:y.sent(),y.label=4;case 4:return f=s.next(),[3,2];case 5:return[3,8];case 6:return d=y.sent(),p={error:d},[3,8];case 7:try{f&&!f.done&&(h=s.return)&&h.call(s)}finally{if(p)throw p.error}return[7];case 8:return[2]}}))}(),function e(){var t=performance.now(),n=null;do{n=s.next()}while(performance.now()-t<u&&!n.done);n.done||setTimeout(e)})()},g=function(e,t,n,o){for(var a=[],l=e,u=function(e){a.push.apply(a,i([],r(e.deps)))},s=0;s<l.length;s++)u(l[s]);var c=f(i(i([],r(t)),r(a)));n.deps=c,n.directives[o].deps=c},w=window.LuciaDirectives||{},A=e({BIND:function(e){var t=e.el,n=e.parts,i=e.data,o=e.state;switch(n[1]){case"class":var a=i.compute(o),l=new RegExp("\\b"+Object.keys(a).join("|")+"\\b","gim"),u=t.className.replace(l,"");if("string"==typeof a)t.className=b(u+" "+a);else if(Array.isArray(a))t.className=b(u+" "+a.join(" "));else{for(var s=[],c=Object.entries(a),f=function(e){var t=r(e,2),n=t[0];t[1]&&s.push(n)},v=0;v<c.length;v++)f(c[v]);s.length>0?t.className=b(u+" "+s.join(" ")):b(u).length>0?t.className=b(u):t.className=""}break;case"style":var d=i.compute(o);t.hasAttribute("style")&&t.removeAttribute("style");for(var p=Object.entries(d),h=function(e){var n=r(e,2),i=n[0],o=n[1];t.style[i]=o},m=0;m<p.length;m++)h(p[m]);break;default:var g=i.compute(o);if("object"===y(g)&&null!==g)for(var w=Object.entries(g),A=function(e){var n=r(e,2),i=n[0],o=n[1];o?t.setAttribute(i,o):t.removeAttribute(i)},j=0;j<w.length;j++)A(w[j]);else g?t.setAttribute(n[1],g):t.hasAttribute(n[1])&&t.removeAttribute(n[1])}},HTML:function(e){var t,n=e.el,r=e.data,i=e.state,o=e.node;o=o;var a=n.component,l=null!==(t=r.compute(i))&&void 0!==t?t:r.value;if(l!==n.innerHTML&&(n.innerHTML=l,s().test(l))){var u=null!=a?a:h(n,i,!0);a||g(u,r.deps,o,"html"),m(u,A,i,r.deps),n.component=u}},MODEL:function(e){var t,n=e.el,r=e.parts,i=e.data,o=e.state,a=n,l=null!==(t=o[i.value])&&void 0!==t?t:u(i.value,a,!0)(o),s="checkbox"===a.type?"checked":"value";if(a[s]!==String(l)&&(a[s]=l),!a.__model_registered){a.addEventListener("debounce"===r[1]?"change":"input",(function(){return function(e,t,n,r){"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?Number(e.value):a?"true"===e.value:l?"null"===e.value?null:void 0:String(e.value),r[n.value]?r[n.value]=i:(i="string"==typeof i?"'"+i+"'":i,u("$state."+n.value+" = "+i,e,!0)(r)),i}(a,l,i,o)})),a.__model_registered=!0}},SHOW:function(e){var t=e.el,n=e.data,r=e.state,i=n.compute(r);i!==t.style.display&&(t.style.display=i?"":"none"),0===t.style.length&&t.removeAttribute("style")},ON:function(e){var t=e.el,n=e.parts,r=e.data,i=e.state,o={},a=n.slice(2),l="__on_"+n[1]+"_registered";if(!t[l]){var u=["outside","global"].some((function(e){return String(a).includes(e)}))?window:t;o.once=a.includes("once"),o.passive=a.includes("passive"),u.addEventListener(n[1],(function(e){if(e instanceof KeyboardEvent&&/\d/gim.test(String(a))){for(var n=[],o=a,l=0;l<o.length;l++)u=o[l],isNaN(u)||n.push(Number(u));if(!n.includes(e.keyCode))return}var u;if(a.includes("prevent")&&e.preventDefault(),a.includes("stop")&&e.stopPropagation(),!a.includes("self")||e.target===t){if(a.includes("outside")){if(t.contains(e.target))return;if(t.offsetWidth<1&&t.offsetHeight<1)return}r.compute(i,e)}}),o),t[l]=!0}},TEXT:function(e){var t,n=e.el,r=e.data,i=e.state,o=null!==(t=r.compute(i))&&void 0!==t?t:r.value;o!==n.textContent&&(n.textContent=o)},FOR:function(e){var t,n=e.el,i=e.data,o=e.state,a=e.node,l=n.component;l||(n.component=h(n,o));var s=r(i.value.split(/\s+(?:in|of)\s+/gim),2),f=s[0],v=s[1],d=r(null==f?void 0:f.trim().replace(/\(|\)/gim,"").split(","),2),p=d[0],y=d[1],b=null!==(t=o[null==v?void 0:v.trim()])&&void 0!==t?t:u(null==v?void 0:v.trim(),n,!0)(o),w=n.__for_template;n.innerHTML.trim()===w&&(n.innerHTML="");var j=(null==b?void 0:b.length)-n.children.length;if(0===(null==b?void 0:b.length))n.innerHTML="";else if(0!==j){for(var S=Math.abs(j);S>0;--S)if(j<0)n.removeChild(n.lastChild);else{var O=String(w),x=/^[^\S]*?<(t(?:head|body|foot|r|d|h))/i.test(O);p&&(O=O.replace(c("this\\."+p.trim()),v+"["+(b.length-S)+"]")),y&&(O=O.replace(c("this\\."+y.trim()),String(b.length-S))),x&&(O="<table>"+O+"</table>");var k=document.createRange().createContextualFragment(O);n.appendChild(x?k.firstElementChild.firstElementChild:k)}n.component=h(n,o)}l||(g(n.component,i.deps,a,"for"),n.removeAttribute("l-for"));var N=0===j?l:h(n,o,!0);m(N||[],A,o,a.deps)}},w),j=function(e,t){t[e.parts[0].toUpperCase()](e)},S=function(e,t,n){void 0===n&&(n={});for(var o=["Object","Array"],a=[],u=0;u<o.length;u++)a.push("[object "+o[u]+"]");var s=a,c={get:function(e,t){var n=e[t];if("object"===y(n)&&null!==n){var r=Object.prototype.toString.call(n);return s.includes(r)?new Proxy(n,c):(l("Data type "+r+" is not supported"),n)}return n},set:function(o,a,l){var u=!isNaN(Number(a))||"length"===a,s=u?[]:[a];if(Array.isArray(o)&&u){var c=Object.keys(e).filter((function(t){return Array.isArray(e[t])&&(n=e[t],r=o,Array.isArray(n)&&Array.isArray(r)&&n.length===r.length&&n.every((function(e,t){return e===r[t]})));var n,r}));s.push.apply(s,i([],r(c)))}else if(!Object.is(o,e)){c=Object.keys(e).filter((function(t){return"[object Object]"===Object.prototype.toString.call(e[t])&&JSON.stringify(e[t]).indexOf(a)>-1}));s.push.apply(s,i([],r(c)))}o[a]=l,t(s);for(var f,v,d,p,h=Object.entries(n),y=0;y<h.length;y++)f=h[y],v=void 0,d=void 0,p=void 0,v=r(f,2),d=v[0],p=v[1],s.includes(d)&&p();return!0}};return new Proxy(Object.seal(e),c)},O=function(){function t(e,t,n){void 0===e&&(e={}),void 0===t&&(t={}),void 0===n&&(n={}),this.ast=[],this.state=e,this.directives=t,this.watchers=n}return t.prototype.mount=function(t){var n="string"==typeof t?document.querySelector(t)||document.body:t,r=e(e({},this.state),{$render:this.render.bind(this)});this.ast=h(n,this.state),this.directives=e(e({},this.directives),A),this.state=S(r,this.render.bind(this),this.watchers),this.render(),n.component=this;var i=new CustomEvent("mounted");return n.dispatchEvent(i),this.state},t.prototype.watch=function(e,t){this.watchers[e]=t},t.prototype.render=function(e){void 0===e&&(e=Object.keys(this.state)),m(this.ast,A,this.state,e)},t}(),x=function(e){return new O(e)};exports.component=x,exports.init=function e(t){void 0===t&&(t=document);for(var n="l-state",o="l-tag",a=i([],r(t.querySelectorAll("[l-state], [l-tag]"))).filter((function(e){return void 0===e.component})),l=!1,u=a,s=function(e){if(e.hasAttribute(o)){for(var a=e.getAttribute(o),u=i([],r(t.querySelectorAll(a))),s=e.content.firstElementChild,c=u,f=0;f<c.length;f++)c[f].replaceWith(s.cloneNode(!0));u.length>0&&(l=!0)}else{var v=e.getAttribute(n),d=new Function("return "+v)()||{};x(d).mount(e)}},c=0;c<u.length;c++)s(u[c]);l&&e(t)};

150

dist/lucia.cjs.js

@@ -22,25 +22,23 @@ 'use strict';

const rawDirectiveSplitRE = () => /:|\./gim;
const eventDirectivePrefixRE = () => /on|@/gim;
const parenthesisWrapReplaceRE = () => /\(|\)/gim;
const hasDirectiveRE = () => {
return new RegExp(`(${DIRECTIVE_PREFIX}|${Object.keys(DIRECTIVE_SHORTHANDS).join('|')})\\w+`, 'gim');
const error = (err, expression, el) => {
let message = `Lucia Error: "${err}"`;
if (expression)
message += `\n\nExpression: "${expression}"`;
if (el)
message += `\nElement:`;
console.warn(message, el);
};
const expressionPropRE = (prop) => {
return new RegExp(`\\b${prop}\\b`, 'gim');
};
const resolveStateInExpression = (unresolvedExpression, deps = []) => {
let expression = unresolvedExpression;
deps.forEach((dep) => {
if (dep !== expression)
expression = expression.replace(expressionPropRE(dep), `$state.${dep}`);
});
return expression;
};
const computeExpression = (expression, el, returnable = true, refs = {}, deps) => {
const computeExpression = (expression, el, returnable = true, refs = {}) => {
const formattedExpression = `${returnable ? `return ${expression}` : expression}`;
const resolvedExpression = resolveStateInExpression(formattedExpression, deps);
const specialPropertiesNames = ['$state', '$el', '$emit', '$event', '$refs'];
const computeFunction = new Function(`'use strict';return function(${specialPropertiesNames.join(',')}){${resolvedExpression}}`)();
const customGlobalSpecialProperties = window.LuciaSpecialProperties || {};
const specialPropertiesNames = [
'$state',
'$el',
'$emit',
'$event',
'$refs',
...Object.keys(customGlobalSpecialProperties),
];
const computeFunction = new Function(`return function(${specialPropertiesNames.join(',')}){with($state){${formattedExpression}}}`)();
const emit = (name, options, dispatchGlobal = true) => {

@@ -58,7 +56,7 @@ const event = new CustomEvent(name, options);

else {
return computeFunction(state, el, emit, event, refs);
return computeFunction(state, el, emit, event, refs, ...Object.values(customGlobalSpecialProperties));
}
}
catch (err) {
console.warn(`Lucia Error: "${err}"\n\nExpression: "${expression}"\nElement:`, el);
error(err, expression, el);
}

@@ -68,7 +66,10 @@ };

const getElementCustomProp = (el, prop) => {
return el[prop];
const rawDirectiveSplitRE = () => /:|\./gim;
const eventDirectivePrefixRE = () => /on|@/gim;
const parenthesisWrapReplaceRE = () => /\(|\)/gim;
const hasDirectiveRE = () => {
return new RegExp(`(${DIRECTIVE_PREFIX}|${Object.keys(DIRECTIVE_SHORTHANDS).join('|')})\\w+`, 'gim');
};
const setElementCustomProp = (el, prop, value) => {
el[prop] = value;
const expressionPropRE = (prop) => {
return new RegExp(`\\b${prop}\\b`, 'gim');
};

@@ -130,4 +131,4 @@

returnable = false;
if (name.includes('for') && getElementCustomProp(el, FOR_TEMPLATE_FLAG) === undefined) {
setElementCustomProp(el, FOR_TEMPLATE_FLAG, String(el.innerHTML).trim());
if (name.includes('for') && el[FOR_TEMPLATE_FLAG] === undefined) {
el[FOR_TEMPLATE_FLAG] = String(el.innerHTML).trim();
returnable = false;

@@ -138,3 +139,3 @@ }

const directiveData = {
compute: computeExpression(value, el, returnable, refs, uniqueCompiledDeps),
compute: computeExpression(value, el, returnable, refs),
deps: uniqueCompiledDeps,

@@ -176,3 +177,3 @@ value,

const ast = [];
const isListGroup = getElementCustomProp(el, COMPONENT_FLAG) !== undefined && isListRenderScope(el);
const isListGroup = el[COMPONENT_FLAG] !== undefined && isListRenderScope(el);
const elements = flattenElementChildren(el, isListGroup, ignoreRootElement);

@@ -201,7 +202,9 @@ const maskDirective = `${DIRECTIVE_PREFIX}mask`;

const classes = data.compute(state);
const removeDynamicClassesRE = new RegExp(`\\b${Object.keys(classes).join('|')}\\b`, 'gim');
const rawClasses = el.className.replace(removeDynamicClassesRE, '');
if (typeof classes === 'string') {
return el.setAttribute('class', formatAcceptableWhitespace(`${el.className} ${classes}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${classes}`);
}
else if (Array.isArray(classes)) {
return el.setAttribute('class', formatAcceptableWhitespace(`${el.className} ${classes.join(' ')}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${classes.join(' ')}`);
}

@@ -214,12 +217,10 @@ else {

});
const removeDynamicClassesRE = new RegExp(`\\b${Object.keys(classes).join('|')}\\b`, 'gim');
const rawClasses = el.className.replace(removeDynamicClassesRE, '');
if (activeClasses.length > 0) {
return el.setAttribute('class', formatAcceptableWhitespace(`${rawClasses} ${activeClasses.join(' ')}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${activeClasses.join(' ')}`);
}
else if (formatAcceptableWhitespace(rawClasses).length > 0) {
return el.setAttribute('class', formatAcceptableWhitespace(rawClasses));
el.className = formatAcceptableWhitespace(rawClasses);
}
else if (el.hasAttribute('class')) {
return el.removeAttribute('class');
else {
el.className = '';
}

@@ -335,5 +336,5 @@ }

var _a;
const originalAST = getElementCustomProp(el, COMPONENT_FLAG);
const originalAST = el[COMPONENT_FLAG];
if (!originalAST)
setElementCustomProp(el, COMPONENT_FLAG, compile(el, state));
el[COMPONENT_FLAG] = compile(el, state);
const forLoopRE = /\s+(?:in|of)\s+/gim;

@@ -343,3 +344,3 @@ const [expression, target] = data.value.split(forLoopRE);

const currArray = (_a = state[target === null || target === void 0 ? void 0 : target.trim()]) !== null && _a !== void 0 ? _a : computeExpression(target === null || target === void 0 ? void 0 : target.trim(), el, true)(state);
const template = getElementCustomProp(el, FOR_TEMPLATE_FLAG);
const template = el[FOR_TEMPLATE_FLAG];
if (el.innerHTML.trim() === template)

@@ -369,6 +370,6 @@ el.innerHTML = '';

}
setElementCustomProp(el, COMPONENT_FLAG, compile(el, state));
el[COMPONENT_FLAG] = compile(el, state);
}
if (!originalAST) {
adjustDeps(getElementCustomProp(el, COMPONENT_FLAG), data.deps, node, 'for');
adjustDeps(el[COMPONENT_FLAG], data.deps, node, 'for');
el.removeAttribute(`${DIRECTIVE_PREFIX}for`);

@@ -383,3 +384,3 @@ }

node = node;
const marker = getElementCustomProp(el, COMPONENT_FLAG);
const marker = el[COMPONENT_FLAG];
const ret = (_a = data.compute(state)) !== null && _a !== void 0 ? _a : data.value;

@@ -393,3 +394,3 @@ if (ret !== el.innerHTML) {

render(ast, directives, state, data.deps);
setElementCustomProp(el, COMPONENT_FLAG, ast);
el[COMPONENT_FLAG] = ast;
}

@@ -440,6 +441,6 @@ }

}
if (!getElementCustomProp(el, MODEL_REGISTERED_FLAG)) {
if (!el[MODEL_REGISTERED_FLAG]) {
const callback = () => inputCallback(el, hydratedValue, data, state);
el.addEventListener(parts[1] === 'debounce' ? 'change' : 'input', callback);
setElementCustomProp(el, MODEL_REGISTERED_FLAG, true);
el[MODEL_REGISTERED_FLAG] = true;
}

@@ -452,3 +453,4 @@ };

const eventProps = parts.slice(2);
if (getElementCustomProp(el, `__on_${parts[1]}_registered`))
const EVENT_REGISTERED_FLAG = `__on_${parts[1]}_registered`;
if (el[EVENT_REGISTERED_FLAG])
return;

@@ -488,3 +490,3 @@ const target = globalScopeEventProps.some((prop) => String(eventProps).includes(prop))

target.addEventListener(parts[1], handler, options);
setElementCustomProp(el, `__on_${parts[1]}_registered`, true);
el[EVENT_REGISTERED_FLAG] = true;
};

@@ -508,2 +510,3 @@

const customGlobalDirectives = window.LuciaDirectives || {};
const directives = {

@@ -517,2 +520,3 @@ BIND: bindDirective,

FOR: forDirective,
...customGlobalDirectives,
};

@@ -530,2 +534,3 @@ const renderDirective = (props, directives) => {

const reactive = (state, render, watchers = {}) => {
const supportedObjectTypes = ['Object', 'Array'].map((type) => `[object ${type}]`);
const handler = {

@@ -535,3 +540,10 @@ get(target, key) {

if (typeof ret === 'object' && ret !== null) {
return new Proxy(ret, handler);
const objectType = Object.prototype.toString.call(ret);
if (supportedObjectTypes.includes(objectType)) {
return new Proxy(ret, handler);
}
else {
error(`Data type ${objectType} is not supported`);
return ret;
}
}

@@ -588,3 +600,3 @@ else {

this.render();
setElementCustomProp(rootEl, COMPONENT_FLAG, this);
rootEl[COMPONENT_FLAG] = this;
const mountedEvent = new CustomEvent('mounted');

@@ -594,5 +606,2 @@ rootEl.dispatchEvent(mountedEvent);

}
directive(name, callback) {
this.directives[name.toUpperCase()] = callback;
}
watch(name, callback) {

@@ -609,18 +618,29 @@ this.watchers[name] = callback;

const stateDirective = `${DIRECTIVE_PREFIX}state`;
const componentElements = element.querySelectorAll(`[${stateDirective}]`);
const uninitializedComponents = [...componentElements].filter((el) => getElementCustomProp(el, COMPONENT_FLAG) === undefined);
const tagDirective = `${DIRECTIVE_PREFIX}tag`;
const componentElements = element.querySelectorAll(`[${stateDirective}], [${tagDirective}]`);
const uninitializedComponents = [...componentElements].filter((el) => el[COMPONENT_FLAG] === undefined);
let needsReInit = false;
uninitializedComponents.forEach((uninitializedComponent) => {
const stateExpression = uninitializedComponent.getAttribute(stateDirective);
const state = new Function(`return ${stateExpression}`)() || {};
const currentComponent = component(state);
currentComponent.mount(uninitializedComponent);
if (uninitializedComponent.hasAttribute(tagDirective)) {
const tag = uninitializedComponent.getAttribute(tagDirective);
const customComponents = [...element.querySelectorAll(tag)];
const realElement = uninitializedComponent.content.firstElementChild;
customComponents.forEach((customComponent) => {
customComponent.replaceWith(realElement.cloneNode(true));
});
if (customComponents.length > 0)
needsReInit = true;
}
else {
const stateExpression = uninitializedComponent.getAttribute(stateDirective);
const state = new Function(`return ${stateExpression}`)() || {};
const currentComponent = component(state);
currentComponent.mount(uninitializedComponent);
}
});
if (needsReInit)
init(element);
};
exports.compile = compile;
exports.component = component;
exports.computeExpression = computeExpression;
exports.directives = directives;
exports.init = init;
exports.reactive = reactive;
exports.render = render;

2

dist/lucia.cjs.min.js

@@ -1,1 +0,1 @@

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t;!function(e){e["@"]="on",e[":"]="bind"}(e||(e={})),function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(t||(t={}));const s=()=>new RegExp(`(l-|${Object.keys(e).join("|")})\\w+`,"gim"),n=e=>new RegExp(`\\b${e}\\b`,"gim"),r=(e,t,s=!0,r={},i)=>{const o=((e,t=[])=>{let s=e;return t.forEach((e=>{e!==s&&(s=s.replace(n(e),`$state.${e}`))})),s})(`${s?`return ${e}`:e}`,i),c=new Function(`'use strict';return function(${["$state","$el","$emit","$event","$refs"].join(",")}){${o}}`)(),l=(e,s,n=!0)=>{const r=new CustomEvent(e,s);(n?window:t||window).dispatchEvent(r)};return(s,n)=>{try{const i=s[e];return i?"function"==typeof i?i.bind(s)():i:c(s,t,l,n,r)}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${e}"\nElement:`,t)}}},i=(e,t)=>e[t],o=(e,t,s)=>{e[t]=s},c=e=>[...new Set(e)],l=e=>e.hasAttribute("l-for"),a=(t,s={})=>{const l={},a=(()=>{const e="l-ref",t=document.querySelectorAll("[l-ref]"),s={};return t.forEach((t=>{const n=t.getAttribute(e);n&&(s[n]=t)})),s})(),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===i(t,"__for_template")&&(o(t,"__for_template",String(t.innerHTML).trim()),y=!1);const A=c([...g,...v]);u.push(...A);const $={compute:r(p,t,y,a,A),deps:A,value:p};l[(h?d.slice("l-".length):`${e[d[0]]}:${d.slice(1)}`).toLowerCase()]=$}return[l,c(u)]},u=(e,t=!1,s=!1)=>{const n=[],r=l(e),i=!!(o=e).parentElement&&o.parentElement.hasAttribute("l-for");var o;if(!t&&(r||i))return n;if(s||t&&r||n.push(e),t||!r&&!i)for(const s of e.children)if(s instanceof HTMLElement)if(!t&&l(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...u(s,t,0===s.attributes.length))}return n},d=(e,r={},o=!1)=>{const c=[],d=void 0!==i(e,"component")&&l(e),p=u(e,d,o),f="l-mask";return p.forEach((e=>{if(e.hasAttribute(f)&&e.removeAttribute(f),s().test(e.outerHTML)){const s=((e,s)=>{const[r,i]=a(e,s),o=Object.keys(r).length>0,c=Object.values(r).some((({value:e})=>Object.keys(s).some((t=>n(t).test(e)))))?t.DYNAMIC:t.STATIC;return o?{el:e,deps:i,directives:r,type:c}:void 0})(e,r);s&&c.push(s)}})),c},p=e=>e.replace(/\s+/gim," ").trim(),f=(e,s,n={},r=[])=>{const i=Object.keys(s);((e,t)=>{const s=t();return function t(){const n=performance.now();let r=null;do{r=s.next()}while(performance.now()-n<e&&!r.done);r.done||setTimeout(t)}})(25,(function*(){for(const o of e){if(o.type===t.NULL)continue;const e=o.type===t.STATIC;e&&(o.type=t.NULL),yield;if(r.some((e=>o.deps.includes(e)))||e){for(const[t,c]of Object.entries(o.directives)){const l=t.split(/:|\./gim)[0];if(!i.includes(l.toUpperCase()))continue;yield;const a=r.some((e=>c.deps.includes(e))),u="l-mask"===t,d=0===Object.keys(c.deps).length;if(a||e||d){const e={el:o.el,parts:t.split(/:|\./gim),data:c,node:o,state:n};v(e,s),(d||u)&&(delete o.directives[t],u&&o.el.removeAttribute("l-mask"))}}if(o.directives["on:effect"]){const e=new CustomEvent("effect");o.el.dispatchEvent(e)}}}}))()},h=(e,t,s,n)=>{const r=[];e.forEach((e=>{r.push(...e.deps)}));const i=c([...t,...r]);s.deps=i,s.directives[n].deps=i},m={BIND:({el:e,parts:t,data:s,state:n})=>{switch(t[1]){case"class":{const t=s.compute(n);if("string"==typeof t)return e.setAttribute("class",p(`${e.className} ${t}`));if(Array.isArray(t))return e.setAttribute("class",p(`${e.className} ${t.join(" ")}`));{const s=[];Object.entries(t).forEach((([e,t])=>{t&&s.push(e)}));const n=new RegExp(`\\b${Object.keys(t).join("|")}\\b`,"gim"),r=e.className.replace(n,"");if(s.length>0)return e.setAttribute("class",p(`${r} ${s.join(" ")}`));if(p(r).length>0)return e.setAttribute("class",p(r));if(e.hasAttribute("class"))return e.removeAttribute("class")}break}case"style":{const t=s.compute(n);e.hasAttribute("style")&&e.removeAttribute("style"),Object.entries(t).forEach((([t,s])=>{e.style[t]=s}));break}default:{const r=s.compute(n);"object"==typeof r&&null!==r?Object.entries(r).forEach((([t,s])=>{s?e.setAttribute(t,s):e.removeAttribute(t)})):r?e.setAttribute(t[1],r):e.hasAttribute(t[1])&&e.removeAttribute(t[1]);break}}},HTML:({el:e,data:t,state:n,node:r})=>{var c;r=r;const l=i(e,"component"),a=null!==(c=t.compute(n))&&void 0!==c?c:t.value;if(a!==e.innerHTML&&(e.innerHTML=a,s().test(a))){const s=null!=l?l:d(e,n,!0);l||h(s,t.deps,r,"html"),f(s,m,n,t.deps),o(e,"component",s)}},MODEL:({el:e,parts:t,data:s,state:n})=>{var c;const l=e,a=null!==(c=n[s.value])&&void 0!==c?c:r(s.value,l,!0)(n),u="checkbox"===l.type?"checked":"value";if(l[u]!==String(a)&&(l[u]=a),!i(l,"__model_registered")){const e=()=>((e,t,s,n)=>{"checkbox"===e.type&&(e.value=String(e.checked));const i="number"==typeof t&&!isNaN(e.value),o="boolean"==typeof t&&("true"===e.value||"false"===e.value),c=null==t&&("null"===e.value||"undefined"===e.value);let l;return l=i?Number(e.value):o?"true"===e.value:c?"null"===e.value?null:void 0:String(e.value),n[s.value]?n[s.value]=l:(l="string"==typeof l?`'${l}'`:l,r(`$state.${s.value} = ${l}`,e,!0)(n)),l})(l,a,s,n);l.addEventListener("debounce"===t[1]?"change":"input",e),o(l,"__model_registered",!0)}},SHOW:({el:e,data:t,state:s})=>{const n=t.compute(s);n!==e.style.display&&(e.style.display=n?"":"none"),0===e.style.length&&e.removeAttribute("style")},ON:({el:e,parts:t,data:s,state:n})=>{const r={},c=t.slice(2);if(i(e,`__on_${t[1]}_registered`))return;const l=["outside","global"].some((e=>String(c).includes(e)))?window:e;r.once=c.includes("once"),r.passive=c.includes("passive"),l.addEventListener(t[1],(t=>{if(t instanceof KeyboardEvent&&/\d/gim.test(String(c))){const e=[];if(c.forEach((t=>{isNaN(t)||e.push(Number(t))})),!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)}}),r),o(e,`__on_${t[1]}_registered`,!0)},TEXT:({el:e,data:t,state:s})=>{var n;const r=null!==(n=t.compute(s))&&void 0!==n?n:t.value;r!==e.textContent&&(e.textContent=r)},FOR:({el:e,data:t,state:s,node:c})=>{var l;const a=i(e,"component");a||o(e,"component",d(e,s));const[u,p]=t.value.split(/\s+(?:in|of)\s+/gim),[v,b]=null==u?void 0:u.trim().replace(/\(|\)/gim,"").split(","),y=null!==(l=s[null==p?void 0:p.trim()])&&void 0!==l?l:r(null==p?void 0:p.trim(),e,!0)(s),g=i(e,"__for_template");e.innerHTML.trim()===g&&(e.innerHTML="");const A=(null==y?void 0:y.length)-e.children.length;if(0===(null==y?void 0:y.length))e.innerHTML="";else if(0!==A){for(let t=Math.abs(A);t>0;--t)if(A<0)e.removeChild(e.lastChild);else{let s=String(g);const r=/^[^\S]*?<(t(?:head|body|foot|r|d|h))/i.test(s);v&&(s=s.replace(n(`this\\.${v.trim()}`),`${p}[${y.length-t}]`)),b&&(s=s.replace(n(`this\\.${b.trim()}`),String(y.length-t))),r&&(s=`<table>${s}</table>`);const i=document.createRange().createContextualFragment(s);e.appendChild(r?i.firstElementChild.firstElementChild:i)}o(e,"component",d(e,s))}a||(h(i(e,"component"),t.deps,c,"for"),e.removeAttribute("l-for"));const $=0===A?a:d(e,s,!0);f($||[],m,s,c.deps)}},v=(e,t)=>{t[e.parts[0].toUpperCase()](e)},b=(e,t,s={})=>{const n={get(e,t){const s=e[t];return"object"==typeof s&&null!==s?new Proxy(s,n):s},set(n,r,i){const o=!isNaN(Number(r))||"length"===r,c=o?[]:[r];if(Array.isArray(n)&&o){const t=Object.keys(e).filter((t=>{return Array.isArray(e[t])&&(s=e[t],r=n,Array.isArray(s)&&Array.isArray(r)&&s.length===r.length&&s.every(((e,t)=>e===r[t])));var s,r}));c.push(...t)}else if(!Object.is(n,e)){const t=Object.keys(e).filter((t=>"[object Object]"===Object.prototype.toString.call(e[t])&&JSON.stringify(e[t]).indexOf(r)>-1));c.push(...t)}return n[r]=i,t(c),Object.entries(s).forEach((([e,t])=>{c.includes(e)&&t()})),!0}};return new Proxy(Object.seal(e),n)};class y{constructor(e={},t={},s={}){this.ast=[],this.state=e,this.directives=t,this.watchers=s}mount(e){const t="string"==typeof e?document.querySelector(e)||document.body:e,s={...this.state,$render:this.render.bind(this)};this.ast=d(t,this.state),this.directives={...this.directives,...m},this.state=b(s,this.render.bind(this),this.watchers),this.render(),o(t,"component",this);const n=new CustomEvent("mounted");return t.dispatchEvent(n),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=d,exports.component=g,exports.computeExpression=r,exports.directives=m,exports.init=(e=document)=>{const t="l-state";[...e.querySelectorAll("[l-state]")].filter((e=>void 0===i(e,"component"))).forEach((e=>{const s=e.getAttribute(t),n=new Function(`return ${s}`)()||{};g(n).mount(e)}))},exports.reactive=b,exports.render=f;
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t;!function(e){e["@"]="on",e[":"]="bind"}(e||(e={})),function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(t||(t={}));const n=(e,t,n)=>{let s=`Lucia Error: "${e}"`;t&&(s+=`\n\nExpression: "${t}"`),n&&(s+="\nElement:"),console.warn(s,n)},s=(e,t,s=!0,r={})=>{const o=`${s?`return ${e}`:e}`,i=window.LuciaSpecialProperties||{},c=["$state","$el","$emit","$event","$refs",...Object.keys(i)],l=new Function(`return function(${c.join(",")}){with($state){${o}}}`)(),a=(e,n,s=!0)=>{const r=new CustomEvent(e,n);(s?window:t||window).dispatchEvent(r)};return(s,o)=>{try{const n=s[e];return n?"function"==typeof n?n.bind(s)():n:l(s,t,a,o,r,...Object.values(i))}catch(s){n(s,e,t)}}},r=()=>new RegExp(`(l-|${Object.keys(e).join("|")})\\w+`,"gim"),o=e=>new RegExp(`\\b${e}\\b`,"gim"),i=e=>[...new Set(e)],c=e=>e.hasAttribute("l-for"),l=(t,n={})=>{const r={},c=(()=>{const e="l-ref",t=document.querySelectorAll("[l-ref]"),n={};return t.forEach((t=>{const s=t.getAttribute(e);s&&(n[s]=t)})),n})(),l=[];for(const{name:a,value:u}of t.attributes){const d="l-state"===a,p=a.startsWith("l-"),f=Object.keys(e).some((e=>a.startsWith(e)));if(d||!p&&!f)continue;const h=[],m=Object.keys(n);let v=!0;const b=m.filter((e=>{const t=o(e).test(String(u));if(t&&"function"==typeof n[e]){const t=m.filter((t=>o(t).test(String(n[e]))));h.push(...t)}return t}));/on|@/gim.test(a)&&(v=!1),a.includes("for")&&void 0===t.__for_template&&(t.__for_template=String(t.innerHTML).trim(),v=!1);const y=i([...b,...h]);l.push(...y);const g={compute:s(u,t,v,c),deps:y,value:u};r[(p?a.slice("l-".length):`${e[a[0]]}:${a.slice(1)}`).toLowerCase()]=g}return[r,i(l)]},a=(e,t=!1,n=!1)=>{const s=[],r=c(e),o=!!(i=e).parentElement&&i.parentElement.hasAttribute("l-for");var i;if(!t&&(r||o))return s;if(n||t&&r||s.push(e),t||!r&&!o)for(const n of e.children)if(n instanceof HTMLElement)if(!t&&c(n))s.push(n);else{if(n.hasAttribute("l-state"))continue;s.push(...a(n,t,0===n.attributes.length))}return s},u=(e,n={},s=!1)=>{const i=[],u=void 0!==e.component&&c(e),d=a(e,u,s),p="l-mask";return d.forEach((e=>{if(e.hasAttribute(p)&&e.removeAttribute(p),r().test(e.outerHTML)){const s=((e,n)=>{const[s,r]=l(e,n),i=Object.keys(s).length>0,c=Object.values(s).some((({value:e})=>Object.keys(n).some((t=>o(t).test(e)))))?t.DYNAMIC:t.STATIC;return i?{el:e,deps:r,directives:s,type:c}:void 0})(e,n);s&&i.push(s)}})),i},d=e=>e.replace(/\s+/gim," ").trim(),p=(e,n,s={},r=[])=>{const o=Object.keys(n);((e,t)=>{const n=t();return function t(){const s=performance.now();let r=null;do{r=n.next()}while(performance.now()-s<e&&!r.done);r.done||setTimeout(t)}})(25,(function*(){for(const i of e){if(i.type===t.NULL)continue;const e=i.type===t.STATIC;e&&(i.type=t.NULL),yield;if(r.some((e=>i.deps.includes(e)))||e){for(const[t,c]of Object.entries(i.directives)){const l=t.split(/:|\./gim)[0];if(!o.includes(l.toUpperCase()))continue;yield;const a=r.some((e=>c.deps.includes(e))),u="l-mask"===t,d=0===Object.keys(c.deps).length;if(a||e||d){const e={el:i.el,parts:t.split(/:|\./gim),data:c,node:i,state:s};m(e,n),(d||u)&&(delete i.directives[t],u&&i.el.removeAttribute("l-mask"))}}if(i.directives["on:effect"]){const e=new CustomEvent("effect");i.el.dispatchEvent(e)}}}}))()},f=(e,t,n,s)=>{const r=[];e.forEach((e=>{r.push(...e.deps)}));const o=i([...t,...r]);n.deps=o,n.directives[s].deps=o},h={BIND:({el:e,parts:t,data:n,state:s})=>{switch(t[1]){case"class":{const t=n.compute(s),r=new RegExp(`\\b${Object.keys(t).join("|")}\\b`,"gim"),o=e.className.replace(r,"");if("string"==typeof t)e.className=d(`${o} ${t}`);else if(Array.isArray(t))e.className=d(`${o} ${t.join(" ")}`);else{const n=[];Object.entries(t).forEach((([e,t])=>{t&&n.push(e)})),n.length>0?e.className=d(`${o} ${n.join(" ")}`):d(o).length>0?e.className=d(o):e.className=""}break}case"style":{const t=n.compute(s);e.hasAttribute("style")&&e.removeAttribute("style"),Object.entries(t).forEach((([t,n])=>{e.style[t]=n}));break}default:{const r=n.compute(s);"object"==typeof r&&null!==r?Object.entries(r).forEach((([t,n])=>{n?e.setAttribute(t,n):e.removeAttribute(t)})):r?e.setAttribute(t[1],r):e.hasAttribute(t[1])&&e.removeAttribute(t[1]);break}}},HTML:({el:e,data:t,state:n,node:s})=>{var o;s=s;const i=e.component,c=null!==(o=t.compute(n))&&void 0!==o?o:t.value;if(c!==e.innerHTML&&(e.innerHTML=c,r().test(c))){const r=null!=i?i:u(e,n,!0);i||f(r,t.deps,s,"html"),p(r,h,n,t.deps),e.component=r}},MODEL:({el:e,parts:t,data:n,state:r})=>{var o;const i=e,c=null!==(o=r[n.value])&&void 0!==o?o:s(n.value,i,!0)(r),l="checkbox"===i.type?"checked":"value";if(i[l]!==String(c)&&(i[l]=c),!i.__model_registered){const e=()=>((e,t,n,r)=>{"checkbox"===e.type&&(e.value=String(e.checked));const o="number"==typeof t&&!isNaN(e.value),i="boolean"==typeof t&&("true"===e.value||"false"===e.value),c=null==t&&("null"===e.value||"undefined"===e.value);let l;return l=o?Number(e.value):i?"true"===e.value:c?"null"===e.value?null:void 0:String(e.value),r[n.value]?r[n.value]=l:(l="string"==typeof l?`'${l}'`:l,s(`$state.${n.value} = ${l}`,e,!0)(r)),l})(i,c,n,r);i.addEventListener("debounce"===t[1]?"change":"input",e),i.__model_registered=!0}},SHOW:({el:e,data:t,state:n})=>{const s=t.compute(n);s!==e.style.display&&(e.style.display=s?"":"none"),0===e.style.length&&e.removeAttribute("style")},ON:({el:e,parts:t,data:n,state:s})=>{const r={},o=t.slice(2),i=`__on_${t[1]}_registered`;if(e[i])return;const c=["outside","global"].some((e=>String(o).includes(e)))?window:e;r.once=o.includes("once"),r.passive=o.includes("passive"),c.addEventListener(t[1],(t=>{if(t instanceof KeyboardEvent&&/\d/gim.test(String(o))){const e=[];if(o.forEach((t=>{isNaN(t)||e.push(Number(t))})),!e.includes(t.keyCode))return}if(o.includes("prevent")&&t.preventDefault(),o.includes("stop")&&t.stopPropagation(),!o.includes("self")||t.target===e){if(o.includes("outside")){if(e.contains(t.target))return;if(e.offsetWidth<1&&e.offsetHeight<1)return}n.compute(s,t)}}),r),e[i]=!0},TEXT:({el:e,data:t,state:n})=>{var s;const r=null!==(s=t.compute(n))&&void 0!==s?s:t.value;r!==e.textContent&&(e.textContent=r)},FOR:({el:e,data:t,state:n,node:r})=>{var i;const c=e.component;c||(e.component=u(e,n));const[l,a]=t.value.split(/\s+(?:in|of)\s+/gim),[d,m]=null==l?void 0:l.trim().replace(/\(|\)/gim,"").split(","),v=null!==(i=n[null==a?void 0:a.trim()])&&void 0!==i?i:s(null==a?void 0:a.trim(),e,!0)(n),b=e.__for_template;e.innerHTML.trim()===b&&(e.innerHTML="");const y=(null==v?void 0:v.length)-e.children.length;if(0===(null==v?void 0:v.length))e.innerHTML="";else if(0!==y){for(let t=Math.abs(y);t>0;--t)if(y<0)e.removeChild(e.lastChild);else{let n=String(b);const s=/^[^\S]*?<(t(?:head|body|foot|r|d|h))/i.test(n);d&&(n=n.replace(o(`this\\.${d.trim()}`),`${a}[${v.length-t}]`)),m&&(n=n.replace(o(`this\\.${m.trim()}`),String(v.length-t))),s&&(n=`<table>${n}</table>`);const r=document.createRange().createContextualFragment(n);e.appendChild(s?r.firstElementChild.firstElementChild:r)}e.component=u(e,n)}c||(f(e.component,t.deps,r,"for"),e.removeAttribute("l-for"));const g=0===y?c:u(e,n,!0);p(g||[],h,n,r.deps)},...window.LuciaDirectives||{}},m=(e,t)=>{t[e.parts[0].toUpperCase()](e)},v=(e,t,s={})=>{const r=["Object","Array"].map((e=>`[object ${e}]`)),o={get(e,t){const s=e[t];if("object"==typeof s&&null!==s){const e=Object.prototype.toString.call(s);return r.includes(e)?new Proxy(s,o):(n(`Data type ${e} is not supported`),s)}return s},set(n,r,o){const i=!isNaN(Number(r))||"length"===r,c=i?[]:[r];if(Array.isArray(n)&&i){const t=Object.keys(e).filter((t=>{return Array.isArray(e[t])&&(s=e[t],r=n,Array.isArray(s)&&Array.isArray(r)&&s.length===r.length&&s.every(((e,t)=>e===r[t])));var s,r}));c.push(...t)}else if(!Object.is(n,e)){const t=Object.keys(e).filter((t=>"[object Object]"===Object.prototype.toString.call(e[t])&&JSON.stringify(e[t]).indexOf(r)>-1));c.push(...t)}return n[r]=o,t(c),Object.entries(s).forEach((([e,t])=>{c.includes(e)&&t()})),!0}};return new Proxy(Object.seal(e),o)};class b{constructor(e={},t={},n={}){this.ast=[],this.state=e,this.directives=t,this.watchers=n}mount(e){const t="string"==typeof e?document.querySelector(e)||document.body:e,n={...this.state,$render:this.render.bind(this)};this.ast=u(t,this.state),this.directives={...this.directives,...h},this.state=v(n,this.render.bind(this),this.watchers),this.render(),t.component=this;const s=new CustomEvent("mounted");return t.dispatchEvent(s),this.state}watch(e,t){this.watchers[e]=t}render(e=Object.keys(this.state)){p(this.ast,h,this.state,e)}}const y=e=>new b(e),g=(e=document)=>{const t="l-state",n="l-tag",s=[...e.querySelectorAll("[l-state], [l-tag]")].filter((e=>void 0===e.component));let r=!1;s.forEach((s=>{if(s.hasAttribute(n)){const t=s.getAttribute(n),o=[...e.querySelectorAll(t)],i=s.content.firstElementChild;o.forEach((e=>{e.replaceWith(i.cloneNode(!0))})),o.length>0&&(r=!0)}else{const e=s.getAttribute(t),n=new Function(`return ${e}`)()||{};y(n).mount(s)}})),r&&g(e)};exports.component=y,exports.init=g;

147

dist/lucia.esm.js

@@ -18,25 +18,23 @@ const DIRECTIVE_PREFIX = 'l-';

const rawDirectiveSplitRE = () => /:|\./gim;
const eventDirectivePrefixRE = () => /on|@/gim;
const parenthesisWrapReplaceRE = () => /\(|\)/gim;
const hasDirectiveRE = () => {
return new RegExp(`(${DIRECTIVE_PREFIX}|${Object.keys(DIRECTIVE_SHORTHANDS).join('|')})\\w+`, 'gim');
const error = (err, expression, el) => {
let message = `Lucia Error: "${err}"`;
if (expression)
message += `\n\nExpression: "${expression}"`;
if (el)
message += `\nElement:`;
console.warn(message, el);
};
const expressionPropRE = (prop) => {
return new RegExp(`\\b${prop}\\b`, 'gim');
};
const resolveStateInExpression = (unresolvedExpression, deps = []) => {
let expression = unresolvedExpression;
deps.forEach((dep) => {
if (dep !== expression)
expression = expression.replace(expressionPropRE(dep), `$state.${dep}`);
});
return expression;
};
const computeExpression = (expression, el, returnable = true, refs = {}, deps) => {
const computeExpression = (expression, el, returnable = true, refs = {}) => {
const formattedExpression = `${returnable ? `return ${expression}` : expression}`;
const resolvedExpression = resolveStateInExpression(formattedExpression, deps);
const specialPropertiesNames = ['$state', '$el', '$emit', '$event', '$refs'];
const computeFunction = new Function(`'use strict';return function(${specialPropertiesNames.join(',')}){${resolvedExpression}}`)();
const customGlobalSpecialProperties = window.LuciaSpecialProperties || {};
const specialPropertiesNames = [
'$state',
'$el',
'$emit',
'$event',
'$refs',
...Object.keys(customGlobalSpecialProperties),
];
const computeFunction = new Function(`return function(${specialPropertiesNames.join(',')}){with($state){${formattedExpression}}}`)();
const emit = (name, options, dispatchGlobal = true) => {

@@ -54,7 +52,7 @@ const event = new CustomEvent(name, options);

else {
return computeFunction(state, el, emit, event, refs);
return computeFunction(state, el, emit, event, refs, ...Object.values(customGlobalSpecialProperties));
}
}
catch (err) {
console.warn(`Lucia Error: "${err}"\n\nExpression: "${expression}"\nElement:`, el);
error(err, expression, el);
}

@@ -64,7 +62,10 @@ };

const getElementCustomProp = (el, prop) => {
return el[prop];
const rawDirectiveSplitRE = () => /:|\./gim;
const eventDirectivePrefixRE = () => /on|@/gim;
const parenthesisWrapReplaceRE = () => /\(|\)/gim;
const hasDirectiveRE = () => {
return new RegExp(`(${DIRECTIVE_PREFIX}|${Object.keys(DIRECTIVE_SHORTHANDS).join('|')})\\w+`, 'gim');
};
const setElementCustomProp = (el, prop, value) => {
el[prop] = value;
const expressionPropRE = (prop) => {
return new RegExp(`\\b${prop}\\b`, 'gim');
};

@@ -126,4 +127,4 @@

returnable = false;
if (name.includes('for') && getElementCustomProp(el, FOR_TEMPLATE_FLAG) === undefined) {
setElementCustomProp(el, FOR_TEMPLATE_FLAG, String(el.innerHTML).trim());
if (name.includes('for') && el[FOR_TEMPLATE_FLAG] === undefined) {
el[FOR_TEMPLATE_FLAG] = String(el.innerHTML).trim();
returnable = false;

@@ -134,3 +135,3 @@ }

const directiveData = {
compute: computeExpression(value, el, returnable, refs, uniqueCompiledDeps),
compute: computeExpression(value, el, returnable, refs),
deps: uniqueCompiledDeps,

@@ -172,3 +173,3 @@ value,

const ast = [];
const isListGroup = getElementCustomProp(el, COMPONENT_FLAG) !== undefined && isListRenderScope(el);
const isListGroup = el[COMPONENT_FLAG] !== undefined && isListRenderScope(el);
const elements = flattenElementChildren(el, isListGroup, ignoreRootElement);

@@ -197,7 +198,9 @@ const maskDirective = `${DIRECTIVE_PREFIX}mask`;

const classes = data.compute(state);
const removeDynamicClassesRE = new RegExp(`\\b${Object.keys(classes).join('|')}\\b`, 'gim');
const rawClasses = el.className.replace(removeDynamicClassesRE, '');
if (typeof classes === 'string') {
return el.setAttribute('class', formatAcceptableWhitespace(`${el.className} ${classes}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${classes}`);
}
else if (Array.isArray(classes)) {
return el.setAttribute('class', formatAcceptableWhitespace(`${el.className} ${classes.join(' ')}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${classes.join(' ')}`);
}

@@ -210,12 +213,10 @@ else {

});
const removeDynamicClassesRE = new RegExp(`\\b${Object.keys(classes).join('|')}\\b`, 'gim');
const rawClasses = el.className.replace(removeDynamicClassesRE, '');
if (activeClasses.length > 0) {
return el.setAttribute('class', formatAcceptableWhitespace(`${rawClasses} ${activeClasses.join(' ')}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${activeClasses.join(' ')}`);
}
else if (formatAcceptableWhitespace(rawClasses).length > 0) {
return el.setAttribute('class', formatAcceptableWhitespace(rawClasses));
el.className = formatAcceptableWhitespace(rawClasses);
}
else if (el.hasAttribute('class')) {
return el.removeAttribute('class');
else {
el.className = '';
}

@@ -331,5 +332,5 @@ }

var _a;
const originalAST = getElementCustomProp(el, COMPONENT_FLAG);
const originalAST = el[COMPONENT_FLAG];
if (!originalAST)
setElementCustomProp(el, COMPONENT_FLAG, compile(el, state));
el[COMPONENT_FLAG] = compile(el, state);
const forLoopRE = /\s+(?:in|of)\s+/gim;

@@ -339,3 +340,3 @@ const [expression, target] = data.value.split(forLoopRE);

const currArray = (_a = state[target === null || target === void 0 ? void 0 : target.trim()]) !== null && _a !== void 0 ? _a : computeExpression(target === null || target === void 0 ? void 0 : target.trim(), el, true)(state);
const template = getElementCustomProp(el, FOR_TEMPLATE_FLAG);
const template = el[FOR_TEMPLATE_FLAG];
if (el.innerHTML.trim() === template)

@@ -365,6 +366,6 @@ el.innerHTML = '';

}
setElementCustomProp(el, COMPONENT_FLAG, compile(el, state));
el[COMPONENT_FLAG] = compile(el, state);
}
if (!originalAST) {
adjustDeps(getElementCustomProp(el, COMPONENT_FLAG), data.deps, node, 'for');
adjustDeps(el[COMPONENT_FLAG], data.deps, node, 'for');
el.removeAttribute(`${DIRECTIVE_PREFIX}for`);

@@ -379,3 +380,3 @@ }

node = node;
const marker = getElementCustomProp(el, COMPONENT_FLAG);
const marker = el[COMPONENT_FLAG];
const ret = (_a = data.compute(state)) !== null && _a !== void 0 ? _a : data.value;

@@ -389,3 +390,3 @@ if (ret !== el.innerHTML) {

render(ast, directives, state, data.deps);
setElementCustomProp(el, COMPONENT_FLAG, ast);
el[COMPONENT_FLAG] = ast;
}

@@ -436,6 +437,6 @@ }

}
if (!getElementCustomProp(el, MODEL_REGISTERED_FLAG)) {
if (!el[MODEL_REGISTERED_FLAG]) {
const callback = () => inputCallback(el, hydratedValue, data, state);
el.addEventListener(parts[1] === 'debounce' ? 'change' : 'input', callback);
setElementCustomProp(el, MODEL_REGISTERED_FLAG, true);
el[MODEL_REGISTERED_FLAG] = true;
}

@@ -448,3 +449,4 @@ };

const eventProps = parts.slice(2);
if (getElementCustomProp(el, `__on_${parts[1]}_registered`))
const EVENT_REGISTERED_FLAG = `__on_${parts[1]}_registered`;
if (el[EVENT_REGISTERED_FLAG])
return;

@@ -484,3 +486,3 @@ const target = globalScopeEventProps.some((prop) => String(eventProps).includes(prop))

target.addEventListener(parts[1], handler, options);
setElementCustomProp(el, `__on_${parts[1]}_registered`, true);
el[EVENT_REGISTERED_FLAG] = true;
};

@@ -504,2 +506,3 @@

const customGlobalDirectives = window.LuciaDirectives || {};
const directives = {

@@ -513,2 +516,3 @@ BIND: bindDirective,

FOR: forDirective,
...customGlobalDirectives,
};

@@ -526,2 +530,3 @@ const renderDirective = (props, directives) => {

const reactive = (state, render, watchers = {}) => {
const supportedObjectTypes = ['Object', 'Array'].map((type) => `[object ${type}]`);
const handler = {

@@ -531,3 +536,10 @@ get(target, key) {

if (typeof ret === 'object' && ret !== null) {
return new Proxy(ret, handler);
const objectType = Object.prototype.toString.call(ret);
if (supportedObjectTypes.includes(objectType)) {
return new Proxy(ret, handler);
}
else {
error(`Data type ${objectType} is not supported`);
return ret;
}
}

@@ -584,3 +596,3 @@ else {

this.render();
setElementCustomProp(rootEl, COMPONENT_FLAG, this);
rootEl[COMPONENT_FLAG] = this;
const mountedEvent = new CustomEvent('mounted');

@@ -590,5 +602,2 @@ rootEl.dispatchEvent(mountedEvent);

}
directive(name, callback) {
this.directives[name.toUpperCase()] = callback;
}
watch(name, callback) {

@@ -605,12 +614,28 @@ this.watchers[name] = callback;

const stateDirective = `${DIRECTIVE_PREFIX}state`;
const componentElements = element.querySelectorAll(`[${stateDirective}]`);
const uninitializedComponents = [...componentElements].filter((el) => getElementCustomProp(el, COMPONENT_FLAG) === undefined);
const tagDirective = `${DIRECTIVE_PREFIX}tag`;
const componentElements = element.querySelectorAll(`[${stateDirective}], [${tagDirective}]`);
const uninitializedComponents = [...componentElements].filter((el) => el[COMPONENT_FLAG] === undefined);
let needsReInit = false;
uninitializedComponents.forEach((uninitializedComponent) => {
const stateExpression = uninitializedComponent.getAttribute(stateDirective);
const state = new Function(`return ${stateExpression}`)() || {};
const currentComponent = component(state);
currentComponent.mount(uninitializedComponent);
if (uninitializedComponent.hasAttribute(tagDirective)) {
const tag = uninitializedComponent.getAttribute(tagDirective);
const customComponents = [...element.querySelectorAll(tag)];
const realElement = uninitializedComponent.content.firstElementChild;
customComponents.forEach((customComponent) => {
customComponent.replaceWith(realElement.cloneNode(true));
});
if (customComponents.length > 0)
needsReInit = true;
}
else {
const stateExpression = uninitializedComponent.getAttribute(stateDirective);
const state = new Function(`return ${stateExpression}`)() || {};
const currentComponent = component(state);
currentComponent.mount(uninitializedComponent);
}
});
if (needsReInit)
init(element);
};
export { compile, component, computeExpression, directives, init, reactive, render };
export { component, init };

2

dist/lucia.esm.min.js

@@ -1,1 +0,1 @@

var e,t;!function(e){e["@"]="on",e[":"]="bind"}(e||(e={})),function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(t||(t={}));const s=()=>new RegExp(`(l-|${Object.keys(e).join("|")})\\w+`,"gim"),n=e=>new RegExp(`\\b${e}\\b`,"gim"),r=(e,t,s=!0,r={},i)=>{const o=((e,t=[])=>{let s=e;return t.forEach((e=>{e!==s&&(s=s.replace(n(e),`$state.${e}`))})),s})(`${s?`return ${e}`:e}`,i),c=new Function(`'use strict';return function(${["$state","$el","$emit","$event","$refs"].join(",")}){${o}}`)(),l=(e,s,n=!0)=>{const r=new CustomEvent(e,s);(n?window:t||window).dispatchEvent(r)};return(s,n)=>{try{const i=s[e];return i?"function"==typeof i?i.bind(s)():i:c(s,t,l,n,r)}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${e}"\nElement:`,t)}}},i=(e,t)=>e[t],o=(e,t,s)=>{e[t]=s},c=e=>[...new Set(e)],l=e=>e.hasAttribute("l-for"),a=(t,s={})=>{const l={},a=(()=>{const e="l-ref",t=document.querySelectorAll("[l-ref]"),s={};return t.forEach((t=>{const n=t.getAttribute(e);n&&(s[n]=t)})),s})(),u=[];for(const{name:d,value:f}of t.attributes){const p="l-state"===d,h=d.startsWith("l-"),m=Object.keys(e).some((e=>d.startsWith(e)));if(p||!h&&!m)continue;const v=[],b=Object.keys(s);let y=!0;const g=b.filter((e=>{const t=n(e).test(String(f));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===i(t,"__for_template")&&(o(t,"__for_template",String(t.innerHTML).trim()),y=!1);const A=c([...g,...v]);u.push(...A);const $={compute:r(f,t,y,a,A),deps:A,value:f};l[(h?d.slice("l-".length):`${e[d[0]]}:${d.slice(1)}`).toLowerCase()]=$}return[l,c(u)]},u=(e,t=!1,s=!1)=>{const n=[],r=l(e),i=!!(o=e).parentElement&&o.parentElement.hasAttribute("l-for");var o;if(!t&&(r||i))return n;if(s||t&&r||n.push(e),t||!r&&!i)for(const s of e.children)if(s instanceof HTMLElement)if(!t&&l(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...u(s,t,0===s.attributes.length))}return n},d=(e,r={},o=!1)=>{const c=[],d=void 0!==i(e,"component")&&l(e),f=u(e,d,o),p="l-mask";return f.forEach((e=>{if(e.hasAttribute(p)&&e.removeAttribute(p),s().test(e.outerHTML)){const s=((e,s)=>{const[r,i]=a(e,s),o=Object.keys(r).length>0,c=Object.values(r).some((({value:e})=>Object.keys(s).some((t=>n(t).test(e)))))?t.DYNAMIC:t.STATIC;return o?{el:e,deps:i,directives:r,type:c}:void 0})(e,r);s&&c.push(s)}})),c},f=e=>e.replace(/\s+/gim," ").trim(),p=(e,s,n={},r=[])=>{const i=Object.keys(s);((e,t)=>{const s=t();return function t(){const n=performance.now();let r=null;do{r=s.next()}while(performance.now()-n<e&&!r.done);r.done||setTimeout(t)}})(25,(function*(){for(const o of e){if(o.type===t.NULL)continue;const e=o.type===t.STATIC;e&&(o.type=t.NULL),yield;if(r.some((e=>o.deps.includes(e)))||e){for(const[t,c]of Object.entries(o.directives)){const l=t.split(/:|\./gim)[0];if(!i.includes(l.toUpperCase()))continue;yield;const a=r.some((e=>c.deps.includes(e))),u="l-mask"===t,d=0===Object.keys(c.deps).length;if(a||e||d){const e={el:o.el,parts:t.split(/:|\./gim),data:c,node:o,state:n};v(e,s),(d||u)&&(delete o.directives[t],u&&o.el.removeAttribute("l-mask"))}}if(o.directives["on:effect"]){const e=new CustomEvent("effect");o.el.dispatchEvent(e)}}}}))()},h=(e,t,s,n)=>{const r=[];e.forEach((e=>{r.push(...e.deps)}));const i=c([...t,...r]);s.deps=i,s.directives[n].deps=i},m={BIND:({el:e,parts:t,data:s,state:n})=>{switch(t[1]){case"class":{const t=s.compute(n);if("string"==typeof t)return e.setAttribute("class",f(`${e.className} ${t}`));if(Array.isArray(t))return e.setAttribute("class",f(`${e.className} ${t.join(" ")}`));{const s=[];Object.entries(t).forEach((([e,t])=>{t&&s.push(e)}));const n=new RegExp(`\\b${Object.keys(t).join("|")}\\b`,"gim"),r=e.className.replace(n,"");if(s.length>0)return e.setAttribute("class",f(`${r} ${s.join(" ")}`));if(f(r).length>0)return e.setAttribute("class",f(r));if(e.hasAttribute("class"))return e.removeAttribute("class")}break}case"style":{const t=s.compute(n);e.hasAttribute("style")&&e.removeAttribute("style"),Object.entries(t).forEach((([t,s])=>{e.style[t]=s}));break}default:{const r=s.compute(n);"object"==typeof r&&null!==r?Object.entries(r).forEach((([t,s])=>{s?e.setAttribute(t,s):e.removeAttribute(t)})):r?e.setAttribute(t[1],r):e.hasAttribute(t[1])&&e.removeAttribute(t[1]);break}}},HTML:({el:e,data:t,state:n,node:r})=>{var c;r=r;const l=i(e,"component"),a=null!==(c=t.compute(n))&&void 0!==c?c:t.value;if(a!==e.innerHTML&&(e.innerHTML=a,s().test(a))){const s=null!=l?l:d(e,n,!0);l||h(s,t.deps,r,"html"),p(s,m,n,t.deps),o(e,"component",s)}},MODEL:({el:e,parts:t,data:s,state:n})=>{var c;const l=e,a=null!==(c=n[s.value])&&void 0!==c?c:r(s.value,l,!0)(n),u="checkbox"===l.type?"checked":"value";if(l[u]!==String(a)&&(l[u]=a),!i(l,"__model_registered")){const e=()=>((e,t,s,n)=>{"checkbox"===e.type&&(e.value=String(e.checked));const i="number"==typeof t&&!isNaN(e.value),o="boolean"==typeof t&&("true"===e.value||"false"===e.value),c=null==t&&("null"===e.value||"undefined"===e.value);let l;return l=i?Number(e.value):o?"true"===e.value:c?"null"===e.value?null:void 0:String(e.value),n[s.value]?n[s.value]=l:(l="string"==typeof l?`'${l}'`:l,r(`$state.${s.value} = ${l}`,e,!0)(n)),l})(l,a,s,n);l.addEventListener("debounce"===t[1]?"change":"input",e),o(l,"__model_registered",!0)}},SHOW:({el:e,data:t,state:s})=>{const n=t.compute(s);n!==e.style.display&&(e.style.display=n?"":"none"),0===e.style.length&&e.removeAttribute("style")},ON:({el:e,parts:t,data:s,state:n})=>{const r={},c=t.slice(2);if(i(e,`__on_${t[1]}_registered`))return;const l=["outside","global"].some((e=>String(c).includes(e)))?window:e;r.once=c.includes("once"),r.passive=c.includes("passive"),l.addEventListener(t[1],(t=>{if(t instanceof KeyboardEvent&&/\d/gim.test(String(c))){const e=[];if(c.forEach((t=>{isNaN(t)||e.push(Number(t))})),!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)}}),r),o(e,`__on_${t[1]}_registered`,!0)},TEXT:({el:e,data:t,state:s})=>{var n;const r=null!==(n=t.compute(s))&&void 0!==n?n:t.value;r!==e.textContent&&(e.textContent=r)},FOR:({el:e,data:t,state:s,node:c})=>{var l;const a=i(e,"component");a||o(e,"component",d(e,s));const[u,f]=t.value.split(/\s+(?:in|of)\s+/gim),[v,b]=null==u?void 0:u.trim().replace(/\(|\)/gim,"").split(","),y=null!==(l=s[null==f?void 0:f.trim()])&&void 0!==l?l:r(null==f?void 0:f.trim(),e,!0)(s),g=i(e,"__for_template");e.innerHTML.trim()===g&&(e.innerHTML="");const A=(null==y?void 0:y.length)-e.children.length;if(0===(null==y?void 0:y.length))e.innerHTML="";else if(0!==A){for(let t=Math.abs(A);t>0;--t)if(A<0)e.removeChild(e.lastChild);else{let s=String(g);const r=/^[^\S]*?<(t(?:head|body|foot|r|d|h))/i.test(s);v&&(s=s.replace(n(`this\\.${v.trim()}`),`${f}[${y.length-t}]`)),b&&(s=s.replace(n(`this\\.${b.trim()}`),String(y.length-t))),r&&(s=`<table>${s}</table>`);const i=document.createRange().createContextualFragment(s);e.appendChild(r?i.firstElementChild.firstElementChild:i)}o(e,"component",d(e,s))}a||(h(i(e,"component"),t.deps,c,"for"),e.removeAttribute("l-for"));const $=0===A?a:d(e,s,!0);p($||[],m,s,c.deps)}},v=(e,t)=>{t[e.parts[0].toUpperCase()](e)},b=(e,t,s={})=>{const n={get(e,t){const s=e[t];return"object"==typeof s&&null!==s?new Proxy(s,n):s},set(n,r,i){const o=!isNaN(Number(r))||"length"===r,c=o?[]:[r];if(Array.isArray(n)&&o){const t=Object.keys(e).filter((t=>{return Array.isArray(e[t])&&(s=e[t],r=n,Array.isArray(s)&&Array.isArray(r)&&s.length===r.length&&s.every(((e,t)=>e===r[t])));var s,r}));c.push(...t)}else if(!Object.is(n,e)){const t=Object.keys(e).filter((t=>"[object Object]"===Object.prototype.toString.call(e[t])&&JSON.stringify(e[t]).indexOf(r)>-1));c.push(...t)}return n[r]=i,t(c),Object.entries(s).forEach((([e,t])=>{c.includes(e)&&t()})),!0}};return new Proxy(Object.seal(e),n)};class y{constructor(e={},t={},s={}){this.ast=[],this.state=e,this.directives=t,this.watchers=s}mount(e){const t="string"==typeof e?document.querySelector(e)||document.body:e,s={...this.state,$render:this.render.bind(this)};this.ast=d(t,this.state),this.directives={...this.directives,...m},this.state=b(s,this.render.bind(this),this.watchers),this.render(),o(t,"component",this);const n=new CustomEvent("mounted");return t.dispatchEvent(n),this.state}directive(e,t){this.directives[e.toUpperCase()]=t}watch(e,t){this.watchers[e]=t}render(e=Object.keys(this.state)){p(this.ast,m,this.state,e)}}const g=e=>new y(e),A=(e=document)=>{const t="l-state";[...e.querySelectorAll("[l-state]")].filter((e=>void 0===i(e,"component"))).forEach((e=>{const s=e.getAttribute(t),n=new Function(`return ${s}`)()||{};g(n).mount(e)}))};export{d as compile,g as component,r as computeExpression,m as directives,A as init,b as reactive,p as render};
var e,t;!function(e){e["@"]="on",e[":"]="bind"}(e||(e={})),function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(t||(t={}));const n=(e,t,n)=>{let s=`Lucia Error: "${e}"`;t&&(s+=`\n\nExpression: "${t}"`),n&&(s+="\nElement:"),console.warn(s,n)},s=(e,t,s=!0,r={})=>{const i=`${s?`return ${e}`:e}`,o=window.LuciaSpecialProperties||{},c=["$state","$el","$emit","$event","$refs",...Object.keys(o)],l=new Function(`return function(${c.join(",")}){with($state){${i}}}`)(),a=(e,n,s=!0)=>{const r=new CustomEvent(e,n);(s?window:t||window).dispatchEvent(r)};return(s,i)=>{try{const n=s[e];return n?"function"==typeof n?n.bind(s)():n:l(s,t,a,i,r,...Object.values(o))}catch(s){n(s,e,t)}}},r=()=>new RegExp(`(l-|${Object.keys(e).join("|")})\\w+`,"gim"),i=e=>new RegExp(`\\b${e}\\b`,"gim"),o=e=>[...new Set(e)],c=e=>e.hasAttribute("l-for"),l=(t,n={})=>{const r={},c=(()=>{const e="l-ref",t=document.querySelectorAll("[l-ref]"),n={};return t.forEach((t=>{const s=t.getAttribute(e);s&&(n[s]=t)})),n})(),l=[];for(const{name:a,value:u}of t.attributes){const d="l-state"===a,p=a.startsWith("l-"),f=Object.keys(e).some((e=>a.startsWith(e)));if(d||!p&&!f)continue;const h=[],m=Object.keys(n);let v=!0;const b=m.filter((e=>{const t=i(e).test(String(u));if(t&&"function"==typeof n[e]){const t=m.filter((t=>i(t).test(String(n[e]))));h.push(...t)}return t}));/on|@/gim.test(a)&&(v=!1),a.includes("for")&&void 0===t.__for_template&&(t.__for_template=String(t.innerHTML).trim(),v=!1);const y=o([...b,...h]);l.push(...y);const g={compute:s(u,t,v,c),deps:y,value:u};r[(p?a.slice("l-".length):`${e[a[0]]}:${a.slice(1)}`).toLowerCase()]=g}return[r,o(l)]},a=(e,t=!1,n=!1)=>{const s=[],r=c(e),i=!!(o=e).parentElement&&o.parentElement.hasAttribute("l-for");var o;if(!t&&(r||i))return s;if(n||t&&r||s.push(e),t||!r&&!i)for(const n of e.children)if(n instanceof HTMLElement)if(!t&&c(n))s.push(n);else{if(n.hasAttribute("l-state"))continue;s.push(...a(n,t,0===n.attributes.length))}return s},u=(e,n={},s=!1)=>{const o=[],u=void 0!==e.component&&c(e),d=a(e,u,s),p="l-mask";return d.forEach((e=>{if(e.hasAttribute(p)&&e.removeAttribute(p),r().test(e.outerHTML)){const s=((e,n)=>{const[s,r]=l(e,n),o=Object.keys(s).length>0,c=Object.values(s).some((({value:e})=>Object.keys(n).some((t=>i(t).test(e)))))?t.DYNAMIC:t.STATIC;return o?{el:e,deps:r,directives:s,type:c}:void 0})(e,n);s&&o.push(s)}})),o},d=e=>e.replace(/\s+/gim," ").trim(),p=(e,n,s={},r=[])=>{const i=Object.keys(n);((e,t)=>{const n=t();return function t(){const s=performance.now();let r=null;do{r=n.next()}while(performance.now()-s<e&&!r.done);r.done||setTimeout(t)}})(25,(function*(){for(const o of e){if(o.type===t.NULL)continue;const e=o.type===t.STATIC;e&&(o.type=t.NULL),yield;if(r.some((e=>o.deps.includes(e)))||e){for(const[t,c]of Object.entries(o.directives)){const l=t.split(/:|\./gim)[0];if(!i.includes(l.toUpperCase()))continue;yield;const a=r.some((e=>c.deps.includes(e))),u="l-mask"===t,d=0===Object.keys(c.deps).length;if(a||e||d){const e={el:o.el,parts:t.split(/:|\./gim),data:c,node:o,state:s};m(e,n),(d||u)&&(delete o.directives[t],u&&o.el.removeAttribute("l-mask"))}}if(o.directives["on:effect"]){const e=new CustomEvent("effect");o.el.dispatchEvent(e)}}}}))()},f=(e,t,n,s)=>{const r=[];e.forEach((e=>{r.push(...e.deps)}));const i=o([...t,...r]);n.deps=i,n.directives[s].deps=i},h={BIND:({el:e,parts:t,data:n,state:s})=>{switch(t[1]){case"class":{const t=n.compute(s),r=new RegExp(`\\b${Object.keys(t).join("|")}\\b`,"gim"),i=e.className.replace(r,"");if("string"==typeof t)e.className=d(`${i} ${t}`);else if(Array.isArray(t))e.className=d(`${i} ${t.join(" ")}`);else{const n=[];Object.entries(t).forEach((([e,t])=>{t&&n.push(e)})),n.length>0?e.className=d(`${i} ${n.join(" ")}`):d(i).length>0?e.className=d(i):e.className=""}break}case"style":{const t=n.compute(s);e.hasAttribute("style")&&e.removeAttribute("style"),Object.entries(t).forEach((([t,n])=>{e.style[t]=n}));break}default:{const r=n.compute(s);"object"==typeof r&&null!==r?Object.entries(r).forEach((([t,n])=>{n?e.setAttribute(t,n):e.removeAttribute(t)})):r?e.setAttribute(t[1],r):e.hasAttribute(t[1])&&e.removeAttribute(t[1]);break}}},HTML:({el:e,data:t,state:n,node:s})=>{var i;s=s;const o=e.component,c=null!==(i=t.compute(n))&&void 0!==i?i:t.value;if(c!==e.innerHTML&&(e.innerHTML=c,r().test(c))){const r=null!=o?o:u(e,n,!0);o||f(r,t.deps,s,"html"),p(r,h,n,t.deps),e.component=r}},MODEL:({el:e,parts:t,data:n,state:r})=>{var i;const o=e,c=null!==(i=r[n.value])&&void 0!==i?i:s(n.value,o,!0)(r),l="checkbox"===o.type?"checked":"value";if(o[l]!==String(c)&&(o[l]=c),!o.__model_registered){const e=()=>((e,t,n,r)=>{"checkbox"===e.type&&(e.value=String(e.checked));const i="number"==typeof t&&!isNaN(e.value),o="boolean"==typeof t&&("true"===e.value||"false"===e.value),c=null==t&&("null"===e.value||"undefined"===e.value);let l;return l=i?Number(e.value):o?"true"===e.value:c?"null"===e.value?null:void 0:String(e.value),r[n.value]?r[n.value]=l:(l="string"==typeof l?`'${l}'`:l,s(`$state.${n.value} = ${l}`,e,!0)(r)),l})(o,c,n,r);o.addEventListener("debounce"===t[1]?"change":"input",e),o.__model_registered=!0}},SHOW:({el:e,data:t,state:n})=>{const s=t.compute(n);s!==e.style.display&&(e.style.display=s?"":"none"),0===e.style.length&&e.removeAttribute("style")},ON:({el:e,parts:t,data:n,state:s})=>{const r={},i=t.slice(2),o=`__on_${t[1]}_registered`;if(e[o])return;const c=["outside","global"].some((e=>String(i).includes(e)))?window:e;r.once=i.includes("once"),r.passive=i.includes("passive"),c.addEventListener(t[1],(t=>{if(t instanceof KeyboardEvent&&/\d/gim.test(String(i))){const e=[];if(i.forEach((t=>{isNaN(t)||e.push(Number(t))})),!e.includes(t.keyCode))return}if(i.includes("prevent")&&t.preventDefault(),i.includes("stop")&&t.stopPropagation(),!i.includes("self")||t.target===e){if(i.includes("outside")){if(e.contains(t.target))return;if(e.offsetWidth<1&&e.offsetHeight<1)return}n.compute(s,t)}}),r),e[o]=!0},TEXT:({el:e,data:t,state:n})=>{var s;const r=null!==(s=t.compute(n))&&void 0!==s?s:t.value;r!==e.textContent&&(e.textContent=r)},FOR:({el:e,data:t,state:n,node:r})=>{var o;const c=e.component;c||(e.component=u(e,n));const[l,a]=t.value.split(/\s+(?:in|of)\s+/gim),[d,m]=null==l?void 0:l.trim().replace(/\(|\)/gim,"").split(","),v=null!==(o=n[null==a?void 0:a.trim()])&&void 0!==o?o:s(null==a?void 0:a.trim(),e,!0)(n),b=e.__for_template;e.innerHTML.trim()===b&&(e.innerHTML="");const y=(null==v?void 0:v.length)-e.children.length;if(0===(null==v?void 0:v.length))e.innerHTML="";else if(0!==y){for(let t=Math.abs(y);t>0;--t)if(y<0)e.removeChild(e.lastChild);else{let n=String(b);const s=/^[^\S]*?<(t(?:head|body|foot|r|d|h))/i.test(n);d&&(n=n.replace(i(`this\\.${d.trim()}`),`${a}[${v.length-t}]`)),m&&(n=n.replace(i(`this\\.${m.trim()}`),String(v.length-t))),s&&(n=`<table>${n}</table>`);const r=document.createRange().createContextualFragment(n);e.appendChild(s?r.firstElementChild.firstElementChild:r)}e.component=u(e,n)}c||(f(e.component,t.deps,r,"for"),e.removeAttribute("l-for"));const g=0===y?c:u(e,n,!0);p(g||[],h,n,r.deps)},...window.LuciaDirectives||{}},m=(e,t)=>{t[e.parts[0].toUpperCase()](e)},v=(e,t,s={})=>{const r=["Object","Array"].map((e=>`[object ${e}]`)),i={get(e,t){const s=e[t];if("object"==typeof s&&null!==s){const e=Object.prototype.toString.call(s);return r.includes(e)?new Proxy(s,i):(n(`Data type ${e} is not supported`),s)}return s},set(n,r,i){const o=!isNaN(Number(r))||"length"===r,c=o?[]:[r];if(Array.isArray(n)&&o){const t=Object.keys(e).filter((t=>{return Array.isArray(e[t])&&(s=e[t],r=n,Array.isArray(s)&&Array.isArray(r)&&s.length===r.length&&s.every(((e,t)=>e===r[t])));var s,r}));c.push(...t)}else if(!Object.is(n,e)){const t=Object.keys(e).filter((t=>"[object Object]"===Object.prototype.toString.call(e[t])&&JSON.stringify(e[t]).indexOf(r)>-1));c.push(...t)}return n[r]=i,t(c),Object.entries(s).forEach((([e,t])=>{c.includes(e)&&t()})),!0}};return new Proxy(Object.seal(e),i)};class b{constructor(e={},t={},n={}){this.ast=[],this.state=e,this.directives=t,this.watchers=n}mount(e){const t="string"==typeof e?document.querySelector(e)||document.body:e,n={...this.state,$render:this.render.bind(this)};this.ast=u(t,this.state),this.directives={...this.directives,...h},this.state=v(n,this.render.bind(this),this.watchers),this.render(),t.component=this;const s=new CustomEvent("mounted");return t.dispatchEvent(s),this.state}watch(e,t){this.watchers[e]=t}render(e=Object.keys(this.state)){p(this.ast,h,this.state,e)}}const y=e=>new b(e),g=(e=document)=>{const t="l-state",n="l-tag",s=[...e.querySelectorAll("[l-state], [l-tag]")].filter((e=>void 0===e.component));let r=!1;s.forEach((s=>{if(s.hasAttribute(n)){const t=s.getAttribute(n),i=[...e.querySelectorAll(t)],o=s.content.firstElementChild;i.forEach((e=>{e.replaceWith(o.cloneNode(!0))})),i.length>0&&(r=!0)}else{const e=s.getAttribute(t),n=new Function(`return ${e}`)()||{};y(n).mount(s)}})),r&&g(e)};export{y as component,g as init};

173

dist/lucia.js

@@ -1,2 +0,2 @@

var Lucia = (function () {
var Lucia = (function (exports) {
'use strict';

@@ -21,25 +21,23 @@

const rawDirectiveSplitRE = () => /:|\./gim;
const eventDirectivePrefixRE = () => /on|@/gim;
const parenthesisWrapReplaceRE = () => /\(|\)/gim;
const hasDirectiveRE = () => {
return new RegExp(`(${DIRECTIVE_PREFIX}|${Object.keys(DIRECTIVE_SHORTHANDS).join('|')})\\w+`, 'gim');
const error = (err, expression, el) => {
let message = `Lucia Error: "${err}"`;
if (expression)
message += `\n\nExpression: "${expression}"`;
if (el)
message += `\nElement:`;
console.warn(message, el);
};
const expressionPropRE = (prop) => {
return new RegExp(`\\b${prop}\\b`, 'gim');
};
const resolveStateInExpression = (unresolvedExpression, deps = []) => {
let expression = unresolvedExpression;
deps.forEach((dep) => {
if (dep !== expression)
expression = expression.replace(expressionPropRE(dep), `$state.${dep}`);
});
return expression;
};
const computeExpression = (expression, el, returnable = true, refs = {}, deps) => {
const computeExpression = (expression, el, returnable = true, refs = {}) => {
const formattedExpression = `${returnable ? `return ${expression}` : expression}`;
const resolvedExpression = resolveStateInExpression(formattedExpression, deps);
const specialPropertiesNames = ['$state', '$el', '$emit', '$event', '$refs'];
const computeFunction = new Function(`'use strict';return function(${specialPropertiesNames.join(',')}){${resolvedExpression}}`)();
const customGlobalSpecialProperties = window.LuciaSpecialProperties || {};
const specialPropertiesNames = [
'$state',
'$el',
'$emit',
'$event',
'$refs',
...Object.keys(customGlobalSpecialProperties),
];
const computeFunction = new Function(`return function(${specialPropertiesNames.join(',')}){with($state){${formattedExpression}}}`)();
const emit = (name, options, dispatchGlobal = true) => {

@@ -57,7 +55,7 @@ const event = new CustomEvent(name, options);

else {
return computeFunction(state, el, emit, event, refs);
return computeFunction(state, el, emit, event, refs, ...Object.values(customGlobalSpecialProperties));
}
}
catch (err) {
console.warn(`Lucia Error: "${err}"\n\nExpression: "${expression}"\nElement:`, el);
error(err, expression, el);
}

@@ -67,7 +65,10 @@ };

const getElementCustomProp = (el, prop) => {
return el[prop];
const rawDirectiveSplitRE = () => /:|\./gim;
const eventDirectivePrefixRE = () => /on|@/gim;
const parenthesisWrapReplaceRE = () => /\(|\)/gim;
const hasDirectiveRE = () => {
return new RegExp(`(${DIRECTIVE_PREFIX}|${Object.keys(DIRECTIVE_SHORTHANDS).join('|')})\\w+`, 'gim');
};
const setElementCustomProp = (el, prop, value) => {
el[prop] = value;
const expressionPropRE = (prop) => {
return new RegExp(`\\b${prop}\\b`, 'gim');
};

@@ -129,4 +130,4 @@

returnable = false;
if (name.includes('for') && getElementCustomProp(el, FOR_TEMPLATE_FLAG) === undefined) {
setElementCustomProp(el, FOR_TEMPLATE_FLAG, String(el.innerHTML).trim());
if (name.includes('for') && el[FOR_TEMPLATE_FLAG] === undefined) {
el[FOR_TEMPLATE_FLAG] = String(el.innerHTML).trim();
returnable = false;

@@ -137,3 +138,3 @@ }

const directiveData = {
compute: computeExpression(value, el, returnable, refs, uniqueCompiledDeps),
compute: computeExpression(value, el, returnable, refs),
deps: uniqueCompiledDeps,

@@ -175,3 +176,3 @@ value,

const ast = [];
const isListGroup = getElementCustomProp(el, COMPONENT_FLAG) !== undefined && isListRenderScope(el);
const isListGroup = el[COMPONENT_FLAG] !== undefined && isListRenderScope(el);
const elements = flattenElementChildren(el, isListGroup, ignoreRootElement);

@@ -200,7 +201,9 @@ const maskDirective = `${DIRECTIVE_PREFIX}mask`;

const classes = data.compute(state);
const removeDynamicClassesRE = new RegExp(`\\b${Object.keys(classes).join('|')}\\b`, 'gim');
const rawClasses = el.className.replace(removeDynamicClassesRE, '');
if (typeof classes === 'string') {
return el.setAttribute('class', formatAcceptableWhitespace(`${el.className} ${classes}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${classes}`);
}
else if (Array.isArray(classes)) {
return el.setAttribute('class', formatAcceptableWhitespace(`${el.className} ${classes.join(' ')}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${classes.join(' ')}`);
}

@@ -213,12 +216,10 @@ else {

});
const removeDynamicClassesRE = new RegExp(`\\b${Object.keys(classes).join('|')}\\b`, 'gim');
const rawClasses = el.className.replace(removeDynamicClassesRE, '');
if (activeClasses.length > 0) {
return el.setAttribute('class', formatAcceptableWhitespace(`${rawClasses} ${activeClasses.join(' ')}`));
el.className = formatAcceptableWhitespace(`${rawClasses} ${activeClasses.join(' ')}`);
}
else if (formatAcceptableWhitespace(rawClasses).length > 0) {
return el.setAttribute('class', formatAcceptableWhitespace(rawClasses));
el.className = formatAcceptableWhitespace(rawClasses);
}
else if (el.hasAttribute('class')) {
return el.removeAttribute('class');
else {
el.className = '';
}

@@ -334,5 +335,5 @@ }

var _a;
const originalAST = getElementCustomProp(el, COMPONENT_FLAG);
const originalAST = el[COMPONENT_FLAG];
if (!originalAST)
setElementCustomProp(el, COMPONENT_FLAG, compile(el, state));
el[COMPONENT_FLAG] = compile(el, state);
const forLoopRE = /\s+(?:in|of)\s+/gim;

@@ -342,3 +343,3 @@ const [expression, target] = data.value.split(forLoopRE);

const currArray = (_a = state[target === null || target === void 0 ? void 0 : target.trim()]) !== null && _a !== void 0 ? _a : computeExpression(target === null || target === void 0 ? void 0 : target.trim(), el, true)(state);
const template = getElementCustomProp(el, FOR_TEMPLATE_FLAG);
const template = el[FOR_TEMPLATE_FLAG];
if (el.innerHTML.trim() === template)

@@ -368,6 +369,6 @@ el.innerHTML = '';

}
setElementCustomProp(el, COMPONENT_FLAG, compile(el, state));
el[COMPONENT_FLAG] = compile(el, state);
}
if (!originalAST) {
adjustDeps(getElementCustomProp(el, COMPONENT_FLAG), data.deps, node, 'for');
adjustDeps(el[COMPONENT_FLAG], data.deps, node, 'for');
el.removeAttribute(`${DIRECTIVE_PREFIX}for`);

@@ -382,3 +383,3 @@ }

node = node;
const marker = getElementCustomProp(el, COMPONENT_FLAG);
const marker = el[COMPONENT_FLAG];
const ret = (_a = data.compute(state)) !== null && _a !== void 0 ? _a : data.value;

@@ -392,3 +393,3 @@ if (ret !== el.innerHTML) {

render(ast, directives, state, data.deps);
setElementCustomProp(el, COMPONENT_FLAG, ast);
el[COMPONENT_FLAG] = ast;
}

@@ -439,6 +440,6 @@ }

}
if (!getElementCustomProp(el, MODEL_REGISTERED_FLAG)) {
if (!el[MODEL_REGISTERED_FLAG]) {
const callback = () => inputCallback(el, hydratedValue, data, state);
el.addEventListener(parts[1] === 'debounce' ? 'change' : 'input', callback);
setElementCustomProp(el, MODEL_REGISTERED_FLAG, true);
el[MODEL_REGISTERED_FLAG] = true;
}

@@ -451,3 +452,4 @@ };

const eventProps = parts.slice(2);
if (getElementCustomProp(el, `__on_${parts[1]}_registered`))
const EVENT_REGISTERED_FLAG = `__on_${parts[1]}_registered`;
if (el[EVENT_REGISTERED_FLAG])
return;

@@ -487,3 +489,3 @@ const target = globalScopeEventProps.some((prop) => String(eventProps).includes(prop))

target.addEventListener(parts[1], handler, options);
setElementCustomProp(el, `__on_${parts[1]}_registered`, true);
el[EVENT_REGISTERED_FLAG] = true;
};

@@ -507,2 +509,3 @@

const customGlobalDirectives = window.LuciaDirectives || {};
const directives = {

@@ -516,2 +519,3 @@ BIND: bindDirective,

FOR: forDirective,
...customGlobalDirectives,
};

@@ -529,2 +533,3 @@ const renderDirective = (props, directives) => {

const reactive = (state, render, watchers = {}) => {
const supportedObjectTypes = ['Object', 'Array'].map((type) => `[object ${type}]`);
const handler = {

@@ -534,3 +539,10 @@ get(target, key) {

if (typeof ret === 'object' && ret !== null) {
return new Proxy(ret, handler);
const objectType = Object.prototype.toString.call(ret);
if (supportedObjectTypes.includes(objectType)) {
return new Proxy(ret, handler);
}
else {
error(`Data type ${objectType} is not supported`);
return ret;
}
}

@@ -587,3 +599,3 @@ else {

this.render();
setElementCustomProp(rootEl, COMPONENT_FLAG, this);
rootEl[COMPONENT_FLAG] = this;
const mountedEvent = new CustomEvent('mounted');

@@ -593,5 +605,2 @@ rootEl.dispatchEvent(mountedEvent);

}
directive(name, callback) {
this.directives[name.toUpperCase()] = callback;
}
watch(name, callback) {

@@ -608,28 +617,33 @@ this.watchers[name] = callback;

const stateDirective = `${DIRECTIVE_PREFIX}state`;
const componentElements = element.querySelectorAll(`[${stateDirective}]`);
const uninitializedComponents = [...componentElements].filter((el) => getElementCustomProp(el, COMPONENT_FLAG) === undefined);
const tagDirective = `${DIRECTIVE_PREFIX}tag`;
const componentElements = element.querySelectorAll(`[${stateDirective}], [${tagDirective}]`);
const uninitializedComponents = [...componentElements].filter((el) => el[COMPONENT_FLAG] === undefined);
let needsReInit = false;
uninitializedComponents.forEach((uninitializedComponent) => {
const stateExpression = uninitializedComponent.getAttribute(stateDirective);
const state = new Function(`return ${stateExpression}`)() || {};
const currentComponent = component(state);
currentComponent.mount(uninitializedComponent);
if (uninitializedComponent.hasAttribute(tagDirective)) {
const tag = uninitializedComponent.getAttribute(tagDirective);
const customComponents = [...element.querySelectorAll(tag)];
const realElement = uninitializedComponent.content.firstElementChild;
customComponents.forEach((customComponent) => {
customComponent.replaceWith(realElement.cloneNode(true));
});
if (customComponents.length > 0)
needsReInit = true;
}
else {
const stateExpression = uninitializedComponent.getAttribute(stateDirective);
const state = new Function(`return ${stateExpression}`)() || {};
const currentComponent = component(state);
currentComponent.mount(uninitializedComponent);
}
});
if (needsReInit)
init(element);
};
var Lucia = /*#__PURE__*/Object.freeze({
__proto__: null,
component: component,
compile: compile,
render: render,
reactive: reactive,
directives: directives,
computeExpression: computeExpression,
init: init
});
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', () => {
const init$1 = window.LuciaInit;
if (init$1) {
init$1(init);
const initCallback = window.LuciaInit;
if (initCallback) {
init(initCallback);
}

@@ -642,4 +656,9 @@ else {

return Lucia;
exports.component = component;
exports.init = init;
}());
Object.defineProperty(exports, '__esModule', { value: true });
return exports;
}({}));

2

dist/lucia.min.js

@@ -1,1 +0,1 @@

var Lucia=function(){"use strict";const e="l-",t="component",s="__for_template",n="__model_registered";var r,i;!function(e){e["@"]="on",e[":"]="bind"}(r||(r={})),function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(i||(i={}));const o=()=>new RegExp(`(l-|${Object.keys(r).join("|")})\\w+`,"gim"),c=e=>new RegExp(`\\b${e}\\b`,"gim"),l=(e,t,s=!0,n={},r)=>{const i=((e,t=[])=>{let s=e;return t.forEach((e=>{e!==s&&(s=s.replace(c(e),`$state.${e}`))})),s})(`${s?`return ${e}`:e}`,r),o=new Function(`'use strict';return function(${["$state","$el","$emit","$event","$refs"].join(",")}){${i}}`)(),l=(e,s,n=!0)=>{const r=new CustomEvent(e,s);(n?window:t||window).dispatchEvent(r)};return(s,r)=>{try{const i=s[e];return i?"function"==typeof i?i.bind(s)():i:o(s,t,l,r,n)}catch(s){console.warn(`Lucia Error: "${s}"\n\nExpression: "${e}"\nElement:`,t)}}},a=(e,t)=>e[t],u=(e,t,s)=>{e[t]=s},d=e=>[...new Set(e)],f=e=>e.hasAttribute("l-for"),p=(t,n={})=>{const i={},o=(()=>{const e="l-ref",t=document.querySelectorAll("[l-ref]"),s={};return t.forEach((t=>{const n=t.getAttribute(e);n&&(s[n]=t)})),s})(),f=[];for(const{name:p,value:h}of t.attributes){const m="l-state"===p,v=p.startsWith(e),b=Object.keys(r).some((e=>p.startsWith(e)));if(m||!v&&!b)continue;const y=[],g=Object.keys(n);let A=!0;const $=g.filter((e=>{const t=c(e).test(String(h));if(t&&"function"==typeof n[e]){const t=g.filter((t=>c(t).test(String(n[e]))));y.push(...t)}return t}));/on|@/gim.test(p)&&(A=!1),p.includes("for")&&void 0===a(t,s)&&(u(t,s,String(t.innerHTML).trim()),A=!1);const E=d([...$,...y]);f.push(...E);const w={compute:l(h,t,A,o,E),deps:E,value:h};i[(v?p.slice(e.length):`${r[p[0]]}:${p.slice(1)}`).toLowerCase()]=w}return[i,d(f)]},h=(e,t=!1,s=!1)=>{const n=[],r=f(e),i=!!(o=e).parentElement&&o.parentElement.hasAttribute("l-for");var o;if(!t&&(r||i))return n;if(s||t&&r||n.push(e),t||!r&&!i)for(const s of e.children)if(s instanceof HTMLElement)if(!t&&f(s))n.push(s);else{if(s.hasAttribute("l-state"))continue;n.push(...h(s,t,0===s.attributes.length))}return n},m=(e,s={},n=!1)=>{const r=[],l=void 0!==a(e,t)&&f(e),u=h(e,l,n),d="l-mask";return u.forEach((e=>{if(e.hasAttribute(d)&&e.removeAttribute(d),o().test(e.outerHTML)){const t=((e,t)=>{const[s,n]=p(e,t),r=Object.keys(s).length>0,o=Object.values(s).some((({value:e})=>Object.keys(t).some((t=>c(t).test(e)))))?i.DYNAMIC:i.STATIC;return r?{el:e,deps:n,directives:s,type:o}:void 0})(e,s);t&&r.push(t)}})),r},v=e=>e.replace(/\s+/gim," ").trim(),b=(e,t,s={},n=[])=>{const r=Object.keys(t);((e,t)=>{const s=t();return function t(){const n=performance.now();let r=null;do{r=s.next()}while(performance.now()-n<e&&!r.done);r.done||setTimeout(t)}})(25,(function*(){for(const o of e){if(o.type===i.NULL)continue;const e=o.type===i.STATIC;e&&(o.type=i.NULL),yield;if(n.some((e=>o.deps.includes(e)))||e){for(const[i,c]of Object.entries(o.directives)){const l=i.split(/:|\./gim)[0];if(!r.includes(l.toUpperCase()))continue;yield;const a=n.some((e=>c.deps.includes(e))),u="l-mask"===i,d=0===Object.keys(c.deps).length;if(a||e||d){const e={el:o.el,parts:i.split(/:|\./gim),data:c,node:o,state:s};A(e,t),(d||u)&&(delete o.directives[i],u&&o.el.removeAttribute("l-mask"))}}if(o.directives["on:effect"]){const e=new CustomEvent("effect");o.el.dispatchEvent(e)}}}}))()},y=(e,t,s,n)=>{const r=[];e.forEach((e=>{r.push(...e.deps)}));const i=d([...t,...r]);s.deps=i,s.directives[n].deps=i},g={BIND:({el:e,parts:t,data:s,state:n})=>{switch(t[1]){case"class":{const t=s.compute(n);if("string"==typeof t)return e.setAttribute("class",v(`${e.className} ${t}`));if(Array.isArray(t))return e.setAttribute("class",v(`${e.className} ${t.join(" ")}`));{const s=[];Object.entries(t).forEach((([e,t])=>{t&&s.push(e)}));const n=new RegExp(`\\b${Object.keys(t).join("|")}\\b`,"gim"),r=e.className.replace(n,"");if(s.length>0)return e.setAttribute("class",v(`${r} ${s.join(" ")}`));if(v(r).length>0)return e.setAttribute("class",v(r));if(e.hasAttribute("class"))return e.removeAttribute("class")}break}case"style":{const t=s.compute(n);e.hasAttribute("style")&&e.removeAttribute("style"),Object.entries(t).forEach((([t,s])=>{e.style[t]=s}));break}default:{const r=s.compute(n);"object"==typeof r&&null!==r?Object.entries(r).forEach((([t,s])=>{s?e.setAttribute(t,s):e.removeAttribute(t)})):r?e.setAttribute(t[1],r):e.hasAttribute(t[1])&&e.removeAttribute(t[1]);break}}},HTML:({el:e,data:s,state:n,node:r})=>{var i;r=r;const c=a(e,t),l=null!==(i=s.compute(n))&&void 0!==i?i:s.value;if(l!==e.innerHTML&&(e.innerHTML=l,o().test(l))){const i=null!=c?c:m(e,n,!0);c||y(i,s.deps,r,"html"),b(i,g,n,s.deps),u(e,t,i)}},MODEL:({el:e,parts:t,data:s,state:r})=>{var i;const o=e,c=null!==(i=r[s.value])&&void 0!==i?i:l(s.value,o,!0)(r),d="checkbox"===o.type?"checked":"value";if(o[d]!==String(c)&&(o[d]=c),!a(o,n)){const e=()=>((e,t,s,n)=>{"checkbox"===e.type&&(e.value=String(e.checked));const r="number"==typeof t&&!isNaN(e.value),i="boolean"==typeof t&&("true"===e.value||"false"===e.value),o=null==t&&("null"===e.value||"undefined"===e.value);let c;return c=r?Number(e.value):i?"true"===e.value:o?"null"===e.value?null:void 0:String(e.value),n[s.value]?n[s.value]=c:(c="string"==typeof c?`'${c}'`:c,l(`$state.${s.value} = ${c}`,e,!0)(n)),c})(o,c,s,r);o.addEventListener("debounce"===t[1]?"change":"input",e),u(o,n,!0)}},SHOW:({el:e,data:t,state:s})=>{const n=t.compute(s);n!==e.style.display&&(e.style.display=n?"":"none"),0===e.style.length&&e.removeAttribute("style")},ON:({el:e,parts:t,data:s,state:n})=>{const r={},i=t.slice(2);if(a(e,`__on_${t[1]}_registered`))return;const o=["outside","global"].some((e=>String(i).includes(e)))?window:e;r.once=i.includes("once"),r.passive=i.includes("passive"),o.addEventListener(t[1],(t=>{if(t instanceof KeyboardEvent&&/\d/gim.test(String(i))){const e=[];if(i.forEach((t=>{isNaN(t)||e.push(Number(t))})),!e.includes(t.keyCode))return}if(i.includes("prevent")&&t.preventDefault(),i.includes("stop")&&t.stopPropagation(),!i.includes("self")||t.target===e){if(i.includes("outside")){if(e.contains(t.target))return;if(e.offsetWidth<1&&e.offsetHeight<1)return}s.compute(n,t)}}),r),u(e,`__on_${t[1]}_registered`,!0)},TEXT:({el:e,data:t,state:s})=>{var n;const r=null!==(n=t.compute(s))&&void 0!==n?n:t.value;r!==e.textContent&&(e.textContent=r)},FOR:({el:e,data:n,state:r,node:i})=>{var o;const d=a(e,t);d||u(e,t,m(e,r));const[f,p]=n.value.split(/\s+(?:in|of)\s+/gim),[h,v]=null==f?void 0:f.trim().replace(/\(|\)/gim,"").split(","),A=null!==(o=r[null==p?void 0:p.trim()])&&void 0!==o?o:l(null==p?void 0:p.trim(),e,!0)(r),$=a(e,s);e.innerHTML.trim()===$&&(e.innerHTML="");const E=(null==A?void 0:A.length)-e.children.length;if(0===(null==A?void 0:A.length))e.innerHTML="";else if(0!==E){for(let t=Math.abs(E);t>0;--t)if(E<0)e.removeChild(e.lastChild);else{let s=String($);const n=/^[^\S]*?<(t(?:head|body|foot|r|d|h))/i.test(s);h&&(s=s.replace(c(`this\\.${h.trim()}`),`${p}[${A.length-t}]`)),v&&(s=s.replace(c(`this\\.${v.trim()}`),String(A.length-t))),n&&(s=`<table>${s}</table>`);const r=document.createRange().createContextualFragment(s);e.appendChild(n?r.firstElementChild.firstElementChild:r)}u(e,t,m(e,r))}d||(y(a(e,t),n.deps,i,"for"),e.removeAttribute("l-for"));const w=0===E?d:m(e,r,!0);b(w||[],g,r,i.deps)}},A=(e,t)=>{t[e.parts[0].toUpperCase()](e)},$=(e,t,s={})=>{const n={get(e,t){const s=e[t];return"object"==typeof s&&null!==s?new Proxy(s,n):s},set(n,r,i){const o=!isNaN(Number(r))||"length"===r,c=o?[]:[r];if(Array.isArray(n)&&o){const t=Object.keys(e).filter((t=>{return Array.isArray(e[t])&&(s=e[t],r=n,Array.isArray(s)&&Array.isArray(r)&&s.length===r.length&&s.every(((e,t)=>e===r[t])));var s,r}));c.push(...t)}else if(!Object.is(n,e)){const t=Object.keys(e).filter((t=>"[object Object]"===Object.prototype.toString.call(e[t])&&JSON.stringify(e[t]).indexOf(r)>-1));c.push(...t)}return n[r]=i,t(c),Object.entries(s).forEach((([e,t])=>{c.includes(e)&&t()})),!0}};return new Proxy(Object.seal(e),n)};class E{constructor(e={},t={},s={}){this.ast=[],this.state=e,this.directives=t,this.watchers=s}mount(e){const s="string"==typeof e?document.querySelector(e)||document.body:e,n={...this.state,$render:this.render.bind(this)};this.ast=m(s,this.state),this.directives={...this.directives,...g},this.state=$(n,this.render.bind(this),this.watchers),this.render(),u(s,t,this);const r=new CustomEvent("mounted");return s.dispatchEvent(r),this.state}directive(e,t){this.directives[e.toUpperCase()]=t}watch(e,t){this.watchers[e]=t}render(e=Object.keys(this.state)){b(this.ast,g,this.state,e)}}const w=e=>new E(e),j=(e=document)=>{const s="l-state";[...e.querySelectorAll("[l-state]")].filter((e=>void 0===a(e,t))).forEach((e=>{const t=e.getAttribute(s),n=new Function(`return ${t}`)()||{};w(n).mount(e)}))};var O=Object.freeze({__proto__:null,component:w,compile:m,render:b,reactive:$,directives:g,computeExpression:l,init:j});return"loading"===document.readyState&&document.addEventListener("DOMContentLoaded",(()=>{const e=window.LuciaInit;e?e(j):j()})),O}();
var Lucia=function(e){"use strict";const t="l-";var n,s;!function(e){e["@"]="on",e[":"]="bind"}(n||(n={})),function(e){e[e.NULL=-1]="NULL",e[e.STATIC=0]="STATIC",e[e.DYNAMIC=1]="DYNAMIC"}(s||(s={}));const o=(e,t,n)=>{let s=`Lucia Error: "${e}"`;t&&(s+=`\n\nExpression: "${t}"`),n&&(s+="\nElement:"),console.warn(s,n)},r=(e,t,n=!0,s={})=>{const r=`${n?`return ${e}`:e}`,i=window.LuciaSpecialProperties||{},c=["$state","$el","$emit","$event","$refs",...Object.keys(i)],l=new Function(`return function(${c.join(",")}){with($state){${r}}}`)(),a=(e,n,s=!0)=>{const o=new CustomEvent(e,n);(s?window:t||window).dispatchEvent(o)};return(n,r)=>{try{const o=n[e];return o?"function"==typeof o?o.bind(n)():o:l(n,t,a,r,s,...Object.values(i))}catch(n){o(n,e,t)}}},i=()=>new RegExp(`(l-|${Object.keys(n).join("|")})\\w+`,"gim"),c=e=>new RegExp(`\\b${e}\\b`,"gim"),l=e=>[...new Set(e)],a=e=>e.hasAttribute("l-for"),u=(e,s={})=>{const o={},i=(()=>{const e="l-ref",t=document.querySelectorAll("[l-ref]"),n={};return t.forEach((t=>{const s=t.getAttribute(e);s&&(n[s]=t)})),n})(),a=[];for(const{name:u,value:d}of e.attributes){const p="l-state"===u,f=u.startsWith(t),h=Object.keys(n).some((e=>u.startsWith(e)));if(p||!f&&!h)continue;const m=[],v=Object.keys(s);let b=!0;const y=v.filter((e=>{const t=c(e).test(String(d));if(t&&"function"==typeof s[e]){const t=v.filter((t=>c(t).test(String(s[e]))));m.push(...t)}return t}));/on|@/gim.test(u)&&(b=!1),u.includes("for")&&void 0===e.__for_template&&(e.__for_template=String(e.innerHTML).trim(),b=!1);const g=l([...y,...m]);a.push(...g);const A={compute:r(d,e,b,i),deps:g,value:d};o[(f?u.slice(t.length):`${n[u[0]]}:${u.slice(1)}`).toLowerCase()]=A}return[o,l(a)]},d=(e,t=!1,n=!1)=>{const s=[],o=a(e),r=!!(i=e).parentElement&&i.parentElement.hasAttribute("l-for");var i;if(!t&&(o||r))return s;if(n||t&&o||s.push(e),t||!o&&!r)for(const n of e.children)if(n instanceof HTMLElement)if(!t&&a(n))s.push(n);else{if(n.hasAttribute("l-state"))continue;s.push(...d(n,t,0===n.attributes.length))}return s},p=(e,t={},n=!1)=>{const o=[],r=void 0!==e.component&&a(e),l=d(e,r,n),p="l-mask";return l.forEach((e=>{if(e.hasAttribute(p)&&e.removeAttribute(p),i().test(e.outerHTML)){const n=((e,t)=>{const[n,o]=u(e,t),r=Object.keys(n).length>0,i=Object.values(n).some((({value:e})=>Object.keys(t).some((t=>c(t).test(e)))))?s.DYNAMIC:s.STATIC;return r?{el:e,deps:o,directives:n,type:i}:void 0})(e,t);n&&o.push(n)}})),o},f=e=>e.replace(/\s+/gim," ").trim(),h=(e,t,n={},o=[])=>{const r=Object.keys(t);((e,t)=>{const n=t();return function t(){const s=performance.now();let o=null;do{o=n.next()}while(performance.now()-s<e&&!o.done);o.done||setTimeout(t)}})(25,(function*(){for(const i of e){if(i.type===s.NULL)continue;const e=i.type===s.STATIC;e&&(i.type=s.NULL),yield;if(o.some((e=>i.deps.includes(e)))||e){for(const[s,c]of Object.entries(i.directives)){const l=s.split(/:|\./gim)[0];if(!r.includes(l.toUpperCase()))continue;yield;const a=o.some((e=>c.deps.includes(e))),u="l-mask"===s,d=0===Object.keys(c.deps).length;if(a||e||d){const e={el:i.el,parts:s.split(/:|\./gim),data:c,node:i,state:n};b(e,t),(d||u)&&(delete i.directives[s],u&&i.el.removeAttribute("l-mask"))}}if(i.directives["on:effect"]){const e=new CustomEvent("effect");i.el.dispatchEvent(e)}}}}))()},m=(e,t,n,s)=>{const o=[];e.forEach((e=>{o.push(...e.deps)}));const r=l([...t,...o]);n.deps=r,n.directives[s].deps=r},v={BIND:({el:e,parts:t,data:n,state:s})=>{switch(t[1]){case"class":{const t=n.compute(s),o=new RegExp(`\\b${Object.keys(t).join("|")}\\b`,"gim"),r=e.className.replace(o,"");if("string"==typeof t)e.className=f(`${r} ${t}`);else if(Array.isArray(t))e.className=f(`${r} ${t.join(" ")}`);else{const n=[];Object.entries(t).forEach((([e,t])=>{t&&n.push(e)})),n.length>0?e.className=f(`${r} ${n.join(" ")}`):f(r).length>0?e.className=f(r):e.className=""}break}case"style":{const t=n.compute(s);e.hasAttribute("style")&&e.removeAttribute("style"),Object.entries(t).forEach((([t,n])=>{e.style[t]=n}));break}default:{const o=n.compute(s);"object"==typeof o&&null!==o?Object.entries(o).forEach((([t,n])=>{n?e.setAttribute(t,n):e.removeAttribute(t)})):o?e.setAttribute(t[1],o):e.hasAttribute(t[1])&&e.removeAttribute(t[1]);break}}},HTML:({el:e,data:t,state:n,node:s})=>{var o;s=s;const r=e.component,c=null!==(o=t.compute(n))&&void 0!==o?o:t.value;if(c!==e.innerHTML&&(e.innerHTML=c,i().test(c))){const o=null!=r?r:p(e,n,!0);r||m(o,t.deps,s,"html"),h(o,v,n,t.deps),e.component=o}},MODEL:({el:e,parts:t,data:n,state:s})=>{var o;const i=e,c=null!==(o=s[n.value])&&void 0!==o?o:r(n.value,i,!0)(s),l="checkbox"===i.type?"checked":"value";if(i[l]!==String(c)&&(i[l]=c),!i.__model_registered){const e=()=>((e,t,n,s)=>{"checkbox"===e.type&&(e.value=String(e.checked));const o="number"==typeof t&&!isNaN(e.value),i="boolean"==typeof t&&("true"===e.value||"false"===e.value),c=null==t&&("null"===e.value||"undefined"===e.value);let l;return l=o?Number(e.value):i?"true"===e.value:c?"null"===e.value?null:void 0:String(e.value),s[n.value]?s[n.value]=l:(l="string"==typeof l?`'${l}'`:l,r(`$state.${n.value} = ${l}`,e,!0)(s)),l})(i,c,n,s);i.addEventListener("debounce"===t[1]?"change":"input",e),i.__model_registered=!0}},SHOW:({el:e,data:t,state:n})=>{const s=t.compute(n);s!==e.style.display&&(e.style.display=s?"":"none"),0===e.style.length&&e.removeAttribute("style")},ON:({el:e,parts:t,data:n,state:s})=>{const o={},r=t.slice(2),i=`__on_${t[1]}_registered`;if(e[i])return;const c=["outside","global"].some((e=>String(r).includes(e)))?window:e;o.once=r.includes("once"),o.passive=r.includes("passive"),c.addEventListener(t[1],(t=>{if(t instanceof KeyboardEvent&&/\d/gim.test(String(r))){const e=[];if(r.forEach((t=>{isNaN(t)||e.push(Number(t))})),!e.includes(t.keyCode))return}if(r.includes("prevent")&&t.preventDefault(),r.includes("stop")&&t.stopPropagation(),!r.includes("self")||t.target===e){if(r.includes("outside")){if(e.contains(t.target))return;if(e.offsetWidth<1&&e.offsetHeight<1)return}n.compute(s,t)}}),o),e[i]=!0},TEXT:({el:e,data:t,state:n})=>{var s;const o=null!==(s=t.compute(n))&&void 0!==s?s:t.value;o!==e.textContent&&(e.textContent=o)},FOR:({el:e,data:t,state:n,node:s})=>{var o;const i=e.component;i||(e.component=p(e,n));const[l,a]=t.value.split(/\s+(?:in|of)\s+/gim),[u,d]=null==l?void 0:l.trim().replace(/\(|\)/gim,"").split(","),f=null!==(o=n[null==a?void 0:a.trim()])&&void 0!==o?o:r(null==a?void 0:a.trim(),e,!0)(n),b=e.__for_template;e.innerHTML.trim()===b&&(e.innerHTML="");const y=(null==f?void 0:f.length)-e.children.length;if(0===(null==f?void 0:f.length))e.innerHTML="";else if(0!==y){for(let t=Math.abs(y);t>0;--t)if(y<0)e.removeChild(e.lastChild);else{let n=String(b);const s=/^[^\S]*?<(t(?:head|body|foot|r|d|h))/i.test(n);u&&(n=n.replace(c(`this\\.${u.trim()}`),`${a}[${f.length-t}]`)),d&&(n=n.replace(c(`this\\.${d.trim()}`),String(f.length-t))),s&&(n=`<table>${n}</table>`);const o=document.createRange().createContextualFragment(n);e.appendChild(s?o.firstElementChild.firstElementChild:o)}e.component=p(e,n)}i||(m(e.component,t.deps,s,"for"),e.removeAttribute("l-for"));const g=0===y?i:p(e,n,!0);h(g||[],v,n,s.deps)},...window.LuciaDirectives||{}},b=(e,t)=>{t[e.parts[0].toUpperCase()](e)},y=(e,t,n={})=>{const s=["Object","Array"].map((e=>`[object ${e}]`)),r={get(e,t){const n=e[t];if("object"==typeof n&&null!==n){const e=Object.prototype.toString.call(n);return s.includes(e)?new Proxy(n,r):(o(`Data type ${e} is not supported`),n)}return n},set(s,o,r){const i=!isNaN(Number(o))||"length"===o,c=i?[]:[o];if(Array.isArray(s)&&i){const t=Object.keys(e).filter((t=>{return Array.isArray(e[t])&&(n=e[t],o=s,Array.isArray(n)&&Array.isArray(o)&&n.length===o.length&&n.every(((e,t)=>e===o[t])));var n,o}));c.push(...t)}else if(!Object.is(s,e)){const t=Object.keys(e).filter((t=>"[object Object]"===Object.prototype.toString.call(e[t])&&JSON.stringify(e[t]).indexOf(o)>-1));c.push(...t)}return s[o]=r,t(c),Object.entries(n).forEach((([e,t])=>{c.includes(e)&&t()})),!0}};return new Proxy(Object.seal(e),r)};class g{constructor(e={},t={},n={}){this.ast=[],this.state=e,this.directives=t,this.watchers=n}mount(e){const t="string"==typeof e?document.querySelector(e)||document.body:e,n={...this.state,$render:this.render.bind(this)};this.ast=p(t,this.state),this.directives={...this.directives,...v},this.state=y(n,this.render.bind(this),this.watchers),this.render(),t.component=this;const s=new CustomEvent("mounted");return t.dispatchEvent(s),this.state}watch(e,t){this.watchers[e]=t}render(e=Object.keys(this.state)){h(this.ast,v,this.state,e)}}const A=e=>new g(e),$=(e=document)=>{const t="l-state",n="l-tag",s=[...e.querySelectorAll("[l-state], [l-tag]")].filter((e=>void 0===e.component));let o=!1;s.forEach((s=>{if(s.hasAttribute(n)){const t=s.getAttribute(n),r=[...e.querySelectorAll(t)],i=s.content.firstElementChild;r.forEach((e=>{e.replaceWith(i.cloneNode(!0))})),r.length>0&&(o=!0)}else{const e=s.getAttribute(t),n=new Function(`return ${e}`)()||{};A(n).mount(s)}})),o&&$(e)};return"loading"===document.readyState&&document.addEventListener("DOMContentLoaded",(()=>{const e=window.LuciaInit;e?$(e):$()})),e.component=A,e.init=$,Object.defineProperty(e,"__esModule",{value:!0}),e}({});

4

dist/types/browser.d.ts

@@ -1,2 +0,2 @@

import * as Lucia from './index';
export default Lucia;
import { init, component } from './index';
export { init, component };

5

dist/types/component.d.ts

@@ -1,2 +0,2 @@

import { ASTNode, DirectiveProps, Directives, State, Watchers } from './models/structs';
import { ASTNode, Directives, State, Watchers } from '@models/structs';
export declare class Component {

@@ -9,7 +9,6 @@ state: State;

mount(el: HTMLElement | string): State;
directive(name: string, callback: (props: DirectiveProps) => void): void;
watch(name: string, callback: () => void): void;
render(props?: string[]): void;
}
export declare const component: (state?: import("./models/generics").UnknownKV | undefined) => Component;
export declare const component: (state?: State | undefined) => Component;
export default component;

2

dist/types/core/compile.d.ts

@@ -1,2 +0,2 @@

import { ASTNode, DirectiveKV, Refs, State } from '../models/structs';
import { ASTNode, DirectiveKV, Refs, State } from '@models/structs';
export declare const isListRenderScope: (el: HTMLElement) => boolean;

@@ -3,0 +3,0 @@ export declare const isUnderListRenderScope: (el: HTMLElement) => boolean;

2

dist/types/core/directive.d.ts

@@ -1,4 +0,4 @@

import { DirectiveProps, Directives } from '../models/structs';
import { DirectiveProps, Directives } from '@models/structs';
export declare const directives: Directives;
export declare const renderDirective: (props: DirectiveProps, directives: Directives) => void;
export default renderDirective;

2

dist/types/core/directives/bind.d.ts

@@ -1,3 +0,3 @@

import { DirectiveProps } from '../../models/structs';
import { DirectiveProps } from '@models/structs';
export declare const formatAcceptableWhitespace: (expression: string) => string;
export declare const bindDirective: ({ el, parts, data, state }: DirectiveProps) => void;

2

dist/types/core/directives/for.d.ts

@@ -1,2 +0,2 @@

import { DirectiveProps } from '../../models/structs';
import { DirectiveProps } from '@models/structs';
export declare const forDirective: ({ el, data, state, node }: DirectiveProps) => void;

2

dist/types/core/directives/html.d.ts

@@ -1,2 +0,2 @@

import { DirectiveProps } from '../../models/structs';
import { DirectiveProps } from '@models/structs';
export declare const htmlDirective: ({ el, data, state, node }: DirectiveProps) => void;

2

dist/types/core/directives/model.d.ts

@@ -1,3 +0,3 @@

import { DirectiveData, DirectiveProps, State } from '../../models/structs';
import { DirectiveData, DirectiveProps, State } from '@models/structs';
export declare const inputCallback: (el: HTMLInputElement, hydratedValue: unknown, data: DirectiveData, state: State) => number | string | undefined | null | boolean;
export declare const modelDirective: ({ el: awaitingTypecastEl, parts, data, state, }: DirectiveProps) => void;

2

dist/types/core/directives/on.d.ts

@@ -1,2 +0,2 @@

import { DirectiveProps } from '../../models/structs';
import { DirectiveProps } from '@models/structs';
export declare const onDirective: ({ el, parts, data, state }: DirectiveProps) => void;

2

dist/types/core/directives/show.d.ts

@@ -1,2 +0,2 @@

import { DirectiveProps } from '../../models/structs';
import { DirectiveProps } from '@models/structs';
export declare const showDirective: ({ el, data, state }: DirectiveProps) => void;

2

dist/types/core/directives/text.d.ts

@@ -1,2 +0,2 @@

import { DirectiveProps } from '../../models/structs';
import { DirectiveProps } from '@models/structs';
export declare const textDirective: ({ el, data, state }: DirectiveProps) => void;

2

dist/types/core/reactive.d.ts

@@ -1,4 +0,4 @@

import { State, Watchers } from '../models/structs';
import { State, Watchers } from '@models/structs';
export declare const arrayEquals: (firstArray: unknown[], secondArray: unknown[]) => boolean;
export declare const reactive: (state: State, render: (props: string[]) => void, watchers?: Watchers) => State;
export default reactive;

6

dist/types/core/render.d.ts

@@ -1,4 +0,4 @@

import { UnknownKV } from '../models/generics';
import { ASTNode, Directives } from '../models/structs';
declare const render: (ast: ASTNode[], directives: Directives, state?: UnknownKV, changedProps?: string[]) => void;
import { KV } from '@models/generics';
import { ASTNode, Directives } from '@models/structs';
declare const render: (ast: ASTNode[], directives: Directives, state?: KV<unknown>, changedProps?: string[]) => void;
export default render;

2

dist/types/core/utils/adjustDeps.d.ts

@@ -1,3 +0,3 @@

import { ASTNode } from '../../models/structs';
import { ASTNode } from '@models/structs';
export declare const adjustDeps: (ast: ASTNode[], currentDeps: string[], node: ASTNode, directiveName: string) => void;
export default adjustDeps;

7

dist/types/core/utils/computeExpression.d.ts

@@ -1,5 +0,4 @@

import { UnknownKV } from '../../models/generics';
import { Refs } from '../../models/structs';
export declare const resolveStateInExpression: (unresolvedExpression: string, deps?: string[]) => string;
export declare const computeExpression: (expression: string, el?: HTMLElement | undefined, returnable?: boolean, refs?: Refs, deps?: string[] | undefined) => (state: UnknownKV, event?: Event | undefined) => any;
import { KV } from '@models/generics';
import { Refs } from '@models/structs';
export declare const computeExpression: (expression: string, el?: HTMLElement | undefined, returnable?: boolean, refs?: Refs) => (state: KV<unknown>, event?: Event | undefined) => any;
export default computeExpression;

9

dist/types/index.d.ts
import component from './component';
import compile from './core/compile';
import { directives } from './core/directive';
import reactive from './core/reactive';
import render from './core/render';
import computeExpression from './core/utils/computeExpression';
export { component, compile, render, reactive, directives, computeExpression };
export declare const init: (element?: HTMLElement | Document) => void;
declare const init: (element?: HTMLElement | Document) => void;
export { init, component };

3

dist/types/models/generics.d.ts

@@ -9,3 +9,2 @@ export declare const DIRECTIVE_PREFIX = "l-";

}
export declare type UnknownKV = Record<string, unknown>;
export declare type StringKV = Record<string, string>;
export declare type KV<T> = Record<string, T>;

14

dist/types/models/structs.d.ts

@@ -1,9 +0,9 @@

import { UnknownKV } from './generics';
export declare type Directives = Record<string, (props: DirectiveProps) => void>;
export declare type Watchers = Record<string, () => void>;
export declare type Refs = Record<string, HTMLElement>;
export declare type State = UnknownKV;
export declare type DirectiveKV = Record<string, DirectiveData>;
import { KV } from './generics';
export declare type Directives = KV<(props: DirectiveProps) => void>;
export declare type Watchers = KV<() => void>;
export declare type Refs = KV<HTMLElement>;
export declare type State = KV<unknown>;
export declare type DirectiveKV = KV<DirectiveData>;
export interface DirectiveData {
compute: (state: UnknownKV, event?: Event) => any;
compute: (state: KV<unknown>, event?: Event) => any;
value: string;

@@ -10,0 +10,0 @@ deps: string[];

17

package.json
{
"name": "lucia",
"version": "0.5.1",
"version": "0.5.2",
"description": "3kb library for tiny web apps",

@@ -16,3 +16,5 @@ "main": "dist/lucia.cjs.js",

"test": "jest --silent --runInBand",
"release": "sh scripts/release.sh"
"release": "sh scripts/release.sh",
"preinstall": "sh scripts/yarn.sh",
"prepare": "husky install"
},

@@ -47,3 +49,3 @@ "repository": {

"engines": {
"node": ">=6.4.0"
"node": ">=14.0.0"
},

@@ -54,5 +56,7 @@ "devDependencies": {

"@babel/preset-typescript": "^7.12.7",
"@commitlint/cli": "^12.1.1",
"@commitlint/config-conventional": "^12.1.1",
"@rollup/plugin-babel": "^5.2.2",
"@rollup/plugin-beep": "^0.2.0",
"@rollup/plugin-commonjs": "18.0.0",
"@rollup/plugin-commonjs": "19.0.0",
"@rollup/plugin-node-resolve": "11.2.0",

@@ -70,3 +74,5 @@ "@rollup/plugin-strip": "^2.0.0",

"eslint-config-prettier": "^8.1.0",
"husky": "^6.0.0",
"jest": "^26.6.1",
"lint-staged": "^11.0.0",
"prettier": "^2.1.2",

@@ -78,4 +84,5 @@ "rollup": "2.45.1",

"ts-jest": "^26.4.2",
"typescript": "^4.1.2"
"tslib": "^2.2.0",
"typescript": "^4.2.4"
}
}

2

README.md

@@ -59,3 +59,3 @@ # <a href="https://lucia.js.org"><img src="https://raw.githubusercontent.com/aidenybai/lucia/master/.github/img/logo.svg" height="60" alt="Lucia Logo" aria-label="Lucia Logo" /></a>

[**→ Start contributing on GitHub**](https://aidenybai.github.io/lucia/)
[**→ Start contributing on GitHub**](https://github.com/aidenybai/lucia/tree/master/docs#readme)

@@ -62,0 +62,0 @@ ## Acknowledgments

dist/types/core/utils/elementCustomProp.d.ts
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc