@componyx/ui 0.0.0-stage → 1.0.4

package/Bindary/Modules/DataUpdater.js

@@ -0,0 +1,351 @@
+/*! Componyx.UI | (c) E.H. Daanen / Componyx | BUSL-1.1 | componyx.com/license */
+await (async function ()
+{
+    await import(`${$UI.getScriptResourcePath('Base.Bindary.Core')}`);
+    const core = componyx.bindary_modules.core;
+
+    const dataUpdater = componyx.bindary_modules.dataUpdater =
+    {
+        initUpdateRules(rules, orgRules)
+        {
+            rules = (rules) ? ($lib.isArray(rules)) ? rules : [rules] : [{}];
+
+            if (orgRules && !$lib.isEmpty(orgRules[0]))
+                rules = orgRules.concat(rules);
+
+            return rules;
+        },
+
+        update(dataMsg, mustUpdateView) 
+        {
+            if (dataMsg)
+            {
+                if (core.fireEvent('preDataUpdate', [dataMsg]) === false) return;
+
+                let update = dataUpdater.updateData.bind(dataUpdater, dataMsg);
+
+                core.autoUpdateView = false;
+
+                // data update
+                if (core.dataLocks['#'])
+                {
+                    core.dataLocks['#'].push(update); // store in cache to postpone data-update until unlock is called
+                }
+                else
+                {
+                    update();
+                    core.fireEvent('postDataUpdate');
+                }
+
+                core.autoUpdateView = true;
+
+                // detect error and fire possible callbacks
+                if (!dataUpdater.advance(dataMsg))
+                {
+                    if (core.routeCallbackId)
+                        core.postRender(); // load route cancelled, but call postRender for possible event listeners
+
+                    return;
+                }
+            }
+
+            if (mustUpdateView !== false) $bindary.updateView(false);
+        },
+
+        advance(dataMsg)
+        {
+            let advance = true, callbackResult, msg;
+
+            if (!$lib.isArray(dataMsg)) dataMsg = [dataMsg];
+
+            for (let index = 0; index < dataMsg.length; ++index)
+            {
+                msg = dataMsg[index];
+
+                if (msg.isError)
+                {
+                    if (core.fireEvent('dataError', [msg]) === false)
+                        advance = false;
+
+                    core.clearPendingUpdate();
+                }
+
+                if (msg.callbackId && msg.callbackId !== core.routeCallbackId)
+                {
+                    if (core.callbacks[msg.callbackId])
+                    {
+                        callbackResult = core.callbacks[msg.callbackId](msg);
+                        delete core.callbacks[msg.callbackId];
+
+                        if (callbackResult === false) advance = false;
+                    } else advance = false; // callback does not exist anymore
+                }
+            }
+
+            if (core.dataLocks['#']) advance = false;
+
+            return advance;
+        },
+
+        updateData(dataMsg)
+        {
+            if (!$lib.isArray(dataMsg)) dataMsg = [dataMsg];
+
+            for (let index = 0; index < dataMsg.length; ++index)
+            {
+                let data = dataMsg[index].data;
+
+                if (data)
+                {
+                    dataUpdater.prepareContainer(core.dataLabel[0], data);
+
+                    if ($lib.isEmpty(dataMsg[index].routeIndex) || dataMsg[index].routeIndex === $bindary.routeIndex)
+                    {
+                        dataUpdater.prepareContainer(core.dataLabel[1], data);
+                        core.cache.routeData[$bindary.routeIndex] = $bindary.routeData;
+                    }
+
+                    if ($lib.isEmpty(dataMsg[index].routePath) || dataMsg[index].routePath === $bindary.routePath)
+                    {
+                        dataUpdater.prepareContainer(core.dataLabel[2], data);
+                        core.cache.viewData[$bindary.routePath] = $bindary.viewData;
+                    }
+                }
+            }
+        },
+
+        prepareContainer(name, data)
+        {
+            let container = data[name];
+            if (!container) return;
+
+            let update = dataUpdater.updateContainer.bind(dataUpdater, name, container, data[name + 'Rules']);
+
+            if (core.dataLocks[name])
+            {
+                core.dataLocks[name].push(update);
+            }
+            else
+            {
+                update();
+            }
+        },
+
+        updateContainer(name, sourceContainer, rulesContainer)
+        {
+            let target, source, rules, path, curTargetContainer, update,
+                targetContainer = $bindary[name];
+
+            for (let key in sourceContainer)
+            {
+                curTargetContainer = targetContainer;
+                source = sourceContainer[key];
+                rules = rulesContainer ? rulesContainer[key] : null;
+                path = rules ? rules.path : null;
+
+                if (rules)
+                {
+                    if (!$lib.isEmpty(rules.routePath) && name === core.dataLabel[2])
+                    {
+                        curTargetContainer = core.cache.viewData[rules.routePath];
+                    }
+                    else if (!$lib.isEmpty(rules.routeIndex) && name === core.dataLabel[1])
+                    {
+                        curTargetContainer = core.cache.routeData[rules.routeIndex];
+                    }
+                }
+
+                target = path ? dataUpdater.getTargetModel(path, curTargetContainer) : { key, obj: curTargetContainer };
+                path = name + core.dksc + (path || key);
+
+                update = dataUpdater.updateModel.bind(dataUpdater, target.key, target.obj, source, rules, path);
+
+                if (core.dataLocks[path])
+                {
+                    core.dataLocks[path].push(update);
+                }
+                else
+                {
+                    update();
+                }
+            }
+        },
+
+        updateModel(key, target, source, rules, path)
+        {
+            let isArray = $lib.isArray(source),
+                defaultUpdateRule = $bindary.defaultUpdateRule;
+
+            core.observed = false;
+
+            if (!(source == null && rules && rules.ignoreNullValues))
+            {
+                if (!rules)
+                    rules = { update: defaultUpdateRule };
+                else if ($lib.isEmpty(rules.update))
+                    rules.update = defaultUpdateRule;
+
+                const equalityCheck = (rules && typeof rules.equalityCheck === 'boolean') ? rules.equalityCheck : $bindary.equalityCheck;
+
+                if (equalityCheck && dataUpdater.deepEqual(target[key], source))
+                    return;
+
+                if ($lib.isEmpty(target[key]) || rules.update === false || !(isArray || $lib.isPlainObject(source)))
+                {
+                    target[key] = source;
+                }
+                else if (isArray)
+                {
+                    dataUpdater.updateArray(target[key], source, rules);
+                }
+                else
+                {
+                    $lib.clone(target[key], source, true, true, true, null, null, null, rules.omitKeys);
+                }
+
+                if (!core.observed)
+                    dataUpdater.dataChange(path, rules, isArray);
+            }
+        },
+
+        deepEqual(a, b, seen = new WeakMap())
+        {
+            if (a === b) return true;
+
+            if (a instanceof Date && b instanceof Date)
+                return a.getTime() === b.getTime();
+
+            if (typeof a !== 'object' || a === null || typeof b !== 'object' || b === null)
+                return false;
+
+            if (seen.has(a))
+            {
+                if (seen.get(a).has(b))
+                {
+                    return true; // already compared these objects
+                }
+            }
+            else
+            {
+                seen.set(a, new WeakSet());
+            }
+            seen.get(a).add(b);
+
+            let keysA = Object.keys(a);
+            let keysB = Object.keys(b);
+
+            if (keysA.length !== keysB.length) return false;
+
+            for (let key of keysA)
+            {
+                if (!keysB.includes(key)) return false;
+                if (!dataUpdater.deepEqual(a[key], b[key], seen)) return false;
+            }
+
+            return true;
+        },
+
+        getTargetModel(path, target)
+        {
+            let pathKey, index;
+
+            while (path)
+            {
+                index = path.indexOf(core.dksc);
+                pathKey = index > -1 ? path.substr(0, index) : path;
+
+                if (index > -1)
+                {
+                    target = target[pathKey] = target[pathKey] || {};
+                    path = index > -1 ? path.substr(index + core.dksc.length) : null;
+                } else
+                {
+                    path = null;
+                }
+            }
+
+            return { key: pathKey, obj: target };
+        },
+
+        dataChange(path, rules, isArray) 
+        {
+            if (!core.dataChanges[path]) core.dataChanges[path] = [];
+            if (rules && isArray) core.dataChanges[path].push(rules);
+        },
+
+        updateArray(target, source, rules)
+        {
+            // the rules are required for updating repeat-elements within the view
+            // removeIndex, addIndex and addCount must be updated in the rules because an array can be updated multiple times (same target, different source array)
+
+            if (!rules)
+                rules = {};
+
+            if ($lib.isEmpty(rules.removeIndex) && rules.removeCount > 0)
+                rules.removeIndex = target.length - rules.removeCount; // set correct index when removeCount is specified
+
+            if (rules.removeCount > 0)
+                target.splice(rules.removeIndex, rules.removeCount);
+
+            if ($lib.isEmpty(rules.addCount))
+                rules.addCount = 0;
+
+            if (rules.updateKey)
+            {
+                let updateKey = rules.updateKey,
+                    add = [];
+
+                rules.keys = [];
+
+                if (rules.removeByKeyValues)
+                {
+                    $lib.each(rules.removeByKeyValues, function (value)
+                    {
+                        let index = $lib.indexOf(target, function (i) { return (i[updateKey] == value); });
+
+                        if (index > -1)
+                        {
+                            rules.keys.push(index.toString());
+                            target.splice(index, 1);
+                        }
+                    });
+                }
+
+                $lib.each(source, function (srcItem)
+                {
+                    let index = $lib.indexOf(target, function (i) { return (i[updateKey] === srcItem[updateKey]); });
+
+                    if (index > -1)
+                    {
+                        rules.keys.push(index.toString());
+                        target[index] = srcItem;
+                    }
+                    else
+                        add.push(srcItem);
+                });
+
+                if (add.length)
+                    dataUpdater.extendTargetArray(target, add, rules);
+            }
+            else
+                dataUpdater.extendTargetArray(target, source, rules);
+        },
+
+        extendTargetArray(target, source, rules)
+        {
+            rules.addCount = source.length;
+
+            if (rules.addCount > 0 && $lib.isEmpty(rules.addIndex))
+                target.push.apply(target, source);
+            else if (rules.addCount > 0)
+                target.splice.apply(target, [rules.addIndex, 0].concat(source));
+
+            if ($lib.isEmpty(rules.addIndex) && rules.addCount > 0)
+                rules.addIndex = target.length - rules.addCount;
+        }
+    };
+})();
+
+var DataUpdater = componyx.bindary_modules.dataUpdater;
+
+export { DataUpdater as default };

package/Bindary/Modules/ExpressionEngine.js

@@ -0,0 +1,347 @@
+/*! Componyx.UI | (c) E.H. Daanen / Componyx | BUSL-1.1 | componyx.com/license */
+await (async function ()
+{
+    await import(`${$UI.getScriptResourcePath('Base.Bindary.Core')}`);
+    componyx.bindary_modules.core;
+
+    componyx.bindary_modules = componyx.bindary_modules || {};
+    componyx.bindary_modules.ExpressionEngine = class ExpressionEngine
+    {
+        constructor()
+        {
+            this.resolveRegex = /^[\$A-Za-z_][\w.@\[\]]*(\(\))?/;
+            this.allowedCharsRegex = /^[|&+\-*/().,\s<>=!?:@_\$[\]{}_A-Za-z0-9'".]+$/;
+            this.allowedMathFunctions = ['abs', 'ceil', 'floor', 'round', 'max', 'min', 'trunc', 'sqrt', 'pow', 'log', 'exp', 'random'];
+            this.allowedStringFunctions = ['toLowerCase', 'toUpperCase', 'trim', 'replace', 'includes', 'indexOf', 'startsWith', 'endsWith', 'slice', 'substring'];
+        }
+
+        /**
+         * Compiles an expression string containing `{{ }}` placeholders into a function.
+         * Supports:
+         * - Multiple `{{ ... }}` placeholders within the string.
+         * - Expressions inside `{{ }}`, including basic operators, custom resolver tokens, and a whitelist of Math and String methods.
+         * - Literal text outside placeholders is preserved as string literals.
+         * 
+         * Supported Math methods: 'abs', 'ceil', 'floor', 'round', 'max', 'min', 'trunc', 'sqrt', 'pow', 'log', 'exp', 'random'
+         * Supported String methods: 'toLowerCase', 'toUpperCase', 'trim', 'replace', 'includes', 'indexOf', 'startsWith', 'endsWith', 'slice', 'substring'
+         * @private
+         * @param {string} expr - The expression string to compile.
+         * @param {function(string, number): any} tokenHandler - Invoked at compile time for each custom token found.
+         * Receives the token string as first argument and the start index of the token in the source string as second argument.
+         * @returns {function(function(string): any): any} A function that takes a resolver callback to provide token values at runtime.
+         * @example
+         * const exprFn = evaluate("Hello {{ String.toUpperCase(name) + '!' }} Your high score is {{ Math.max(a, b) + ' points' }}.");
+         * const result = exprFn(token => {
+         *   const values = { name: "Joe", a: 5, b: 10 };
+         *   return values[token];
+         * });
+         * console.log(result); // "Hello JOE! Your high score is 10 points."
+         */
+        evaluate(expr, tokenHandler)
+        {
+            const allowedCharsRegex = this.allowedCharsRegex,
+                allowedMathFunctions = this.allowedMathFunctions,
+                allowedStringFunctions = this.allowedStringFunctions;
+
+            // --------------------------------------------------------------
+            // Extract balanced parentheses content, used for Math/Strings
+            // --------------------------------------------------------------
+            const extractParentheses = (text, startIndex) =>
+            {
+                if (text[startIndex] !== '(') return null;
+
+                let depth = 1;
+                let index = startIndex + 1;
+
+                while (index < text.length && depth > 0)
+                {
+                    if (text[index] === '(') depth++;
+                    else if (text[index] === ')') depth--;
+                    index++;
+                }
+
+                if (depth !== 0) return null;
+                return { content: text.slice(startIndex + 1, index - 1), endIndex: index - 1 };
+            };
+
+            // --------------------------------------------------------------
+            // Inner expression processor:
+            // Tokenizes Math/Strings/DataKeys/Text recursively.
+            // --------------------------------------------------------------
+            const processExpression = (text, exprStartIndex) =>
+            {
+                text = text.trim();
+                if (!text) return null;
+
+                // Full whitelist check
+                if (!allowedCharsRegex.test(text))
+                    return null;
+
+                let index = 0;
+                let out = '';
+
+                while (index < text.length)
+                {
+                    let ch = text[index];
+
+                    // ----------------------------------------
+                    // Whitespace - skip it
+                    // ----------------------------------------
+                    if (/\s/.test(ch))
+                    {
+                        index++;
+                        continue;
+                    }
+
+                    // ----------------------------------------
+                    // Numeric literals
+                    // ----------------------------------------
+                    if (/\d/.test(ch))
+                    {
+                        out += ch;
+                        index++;
+                        continue;
+                    }
+
+                    // ----------------------------------------
+                    //  Quoted string literal
+                    // ----------------------------------------
+                    if (ch === '"' || ch === "'")
+                    {
+                        const quote = ch;
+                        let start = index++;
+
+                        while (index < text.length)
+                        {
+                            if (text[index] === '\\')
+                            {
+                                index += 2;
+                                continue;
+                            }
+                            if (text[index] === quote)
+                                break;
+                            index++;
+                        }
+
+                        if (index >= text.length) return null;
+
+                        out += text.slice(start, ++index);
+                        continue;
+                    }
+
+                    // ----------------------------------------
+                    // Math or String function call
+                    // ----------------------------------------
+                    let fnMatch = text.slice(index).match(/^(Math|String)\.([A-Za-z_]\w*)/);
+                    if (fnMatch)
+                    {
+                        const type = fnMatch[1],
+                            fnName = fnMatch[2],
+                            allowedFns = type === 'Math' ? allowedMathFunctions : allowedStringFunctions;
+
+                        if (!allowedFns.includes(fnName)) return null;
+
+                        out += (type === 'Math') ? `${type}.${fnName}` : `String.prototype.${fnName}.call`;
+                        index += fnMatch[0].length;
+
+                        if (text[index] !== '(') return null;
+
+                        const paren = extractParentheses(text, index);
+                        if (!paren) return null;
+
+                        const inner = processExpression(paren.content, exprStartIndex + index + 1);
+                        if (inner === null) return null;
+
+                        if (type === 'Math')
+                            out += `(${inner})`;
+                        else
+                            out += `( ${inner} )`;
+
+                        index = paren.endIndex + 1;
+                        continue;
+                    }
+
+                    // ----------------------------------------
+                    // Booleans
+                    // ----------------------------------------
+                    const afterTrue = text[index + 4];
+
+                    if (text.startsWith("true", index) && (afterTrue === undefined || !/[\w]/.test(afterTrue)))
+                    {
+                        out += "true";
+                        index += 4;
+                        continue;
+                    }
+
+                    const afterFalse = text[index + 5];
+
+                    if (text.startsWith("false", index) && (afterFalse === undefined || !/[\w]/.test(afterFalse)))
+                    {
+                        out += "false";
+                        index += 5;
+                        continue;
+                    }
+
+                    // ----------------------------------------
+                    // null
+                    // ----------------------------------------
+                    if (text.startsWith("null", index) && !/\w/.test(text[index + 4] ?? ''))
+                    {
+                        out += "null";
+                        index += 4;
+                        continue;
+                    }
+
+                    // ----------------------------------------
+                    // Empty Object
+                    // ----------------------------------------
+                    if (ch === '{')
+                    {
+                        if (text[index + 1] === '}')
+                        {
+                            out += '{}';
+                            index += 2;
+                            continue;
+                        }
+                        return null;
+                    }
+
+                    // ----------------------------------------
+                    // Empty Array
+                    // ----------------------------------------
+                    if (ch === '[')
+                    {
+                        if (text[index + 1] === ']')
+                        {
+                            out += '[]';
+                            index += 2;
+                            continue;
+                        }
+                        return null;
+                    }
+
+                    // ----------------------------------------
+                    //  Custom Resolver match
+                    // ----------------------------------------
+                    let resolverMatch = text.slice(index).match(this.resolveRegex);
+                    if (resolverMatch)
+                    {
+                        const token = resolverMatch[0];
+
+                        if (tokenHandler)
+                            tokenHandler(token, exprStartIndex + index);
+
+                        out += `resolver(${JSON.stringify(token)})`;
+                        index += token.length;
+                        continue;
+                    }
+
+                    // ----------------------------------------
+                    // Operators
+                    // ----------------------------------------
+                    if ("&|+-*/%()<>!=?:@,.".includes(ch))
+                    {
+                        out += ch;
+                        index++;
+                        continue;
+                    }
+
+
+                    return null;
+                }
+
+                return out;
+            };
+
+            // --------------------------------------------------------------
+            // MAIN PROCESS splits literal text and {{ expressions }}
+            // --------------------------------------------------------------
+            function process(text, index = 0, inPlaceholder = false)
+            {
+                let output = "";
+                let inString = null;
+                let escape = false;
+
+                while (index < text.length)
+                {
+                    let ch = text[index];
+
+                    // Handle escapes
+                    if (ch === '\\' && !escape)
+                    {
+                        escape = true;
+                        output += JSON.stringify(ch) + " + ";  // output the backslash as a literal
+                        index++;
+                        continue;
+                    }
+
+                    if (escape)
+                    {
+                        escape = false;
+                        output += JSON.stringify(ch) + " + ";  // output escaped char as literal, but skip string boundary detection
+                        index++;
+                        continue;
+                    }
+
+                    // Detect string boundaries
+                    if (!escape && (ch === '"' || ch === "'"))
+                    {
+                        if (inString === null) inString = ch;
+                        else if (inString === ch) inString = null;
+                    }
+
+                    if (inPlaceholder)
+                    {
+                        if (inString === null && ch === '}' && text[index + 1] === '}') // Find end of placeholder
+                        {
+                            return { value: output, index: index + 2 }; // Return processed content and new index after }}
+                        }
+                        // Otherwise accumulate inside placeholder
+                        output += ch;
+                        index++;
+                    }
+                    else if (ch === '{' && text[index + 1] === '{')  // Outside placeholder: detect {{ to enter placeholder mode
+                    {
+                        // Recursive call to process inside placeholder
+                        const innerResult = process(text, index + 2, true);
+                        const exprStartIndex = index + 2;
+                        if (!innerResult) return null; // invalid
+
+                        const exprContent = innerResult.value;
+                        index = innerResult.index;
+
+                        const processed = processExpression(exprContent, exprStartIndex);
+                        if (processed === null) return null;
+
+                        output += "(" + processed + ")" + " + ";
+                        continue;
+                    }
+                    else
+                    {
+                        output += JSON.stringify(ch) + " + ";  // Default: literal text outside placeholders
+                        index++;
+                    }
+                }
+
+                // If we are inside a placeholder but no closing }}, invalid expression
+                if (inPlaceholder) return null;
+
+                // Return accumulated string and index (end of text)
+                return { value: output, index: index };
+            }
+
+            if (!expr)
+                return null;
+
+            const result = process(expr, 0, false);
+            if (!result) return null;
+
+            let output = result.value.replace(/\s*\+\s*$/, ""); // Trim trailing " + "
+            return Function('resolver', `"use strict"; return (${output})`); // Run JS-safe parsed code and accept resolver fn
+        }
+    };
+})();
+
+var ExpressionEngine = componyx.bindary_modules.expressionEngine;
+
+export { ExpressionEngine as default };