native-document 1.0.80 → 1.0.82

package/dist/native-document.dev.js

@@ -141,79 +141,85 @@ var NativeDocument = (function (exports) {
         return this.observable.cleanup();
     };
 
-    const PluginsManager = (function() {
+    let PluginsManager$1 = null;
 
-        const $plugins = new Map();
-        const $pluginByEvents = new Map();
+    {
+        PluginsManager$1 = (function() {
 
-        return {
-            list() {
-                return $pluginByEvents;
-            },
-            add(plugin, name){
-                if (!plugin || typeof plugin !== 'object') {
-                    throw new Error(`Plugin ${name} must be an object`);
-                }
-                name = name || plugin.name;
-                if (!name || typeof name !== 'string') {
-                    throw new Error(`Please, provide a valid plugin name`);
-                }
-                if($plugins.has(name)) {
-                    return;
-                }
+            const $plugins = new Map();
+            const $pluginByEvents = new Map();
 
-                plugin.$name = name;
-                $plugins.set(name ,plugin);
-                if(typeof plugin?.init === 'function') {
-                    plugin.init();
-                }
-                for(const methodName in plugin) {
-                    if(/^on[A-Z]/.test(methodName)) {
-                        const eventName = methodName.replace(/^on/, '');
-                        if(!$pluginByEvents.has(eventName)) {
-                            $pluginByEvents.set(eventName, new Set());
+            return {
+                list() {
+                    return $pluginByEvents;
+                },
+                add(plugin, name){
+                    if (!plugin || typeof plugin !== 'object') {
+                        throw new Error(`Plugin ${name} must be an object`);
+                    }
+                    name = name || plugin.name;
+                    if (!name || typeof name !== 'string') {
+                        throw new Error(`Please, provide a valid plugin name`);
+                    }
+                    if($plugins.has(name)) {
+                        return;
+                    }
+
+                    plugin.$name = name;
+                    $plugins.set(name ,plugin);
+                    if(typeof plugin?.init === 'function') {
+                        plugin.init();
+                    }
+                    for(const methodName in plugin) {
+                        if(/^on[A-Z]/.test(methodName)) {
+                            const eventName = methodName.replace(/^on/, '');
+                            if(!$pluginByEvents.has(eventName)) {
+                                $pluginByEvents.set(eventName, new Set());
+                            }
+                            $pluginByEvents.get(eventName).add(plugin);
                         }
-                        $pluginByEvents.get(eventName).add(plugin);
                     }
-                }
-            },
-            remove(pluginName){
-                if(!$plugins.has(pluginName)) {
-                    return;
-                }
-                const plugin = $plugins.get(pluginName);
-                if(typeof plugin.cleanup === 'function') {
-                    plugin.cleanup();
-                }
-                for(const [name, sets] of $pluginByEvents.entries() ) {
-                    if(sets.has(plugin)) {
-                        sets.delete(plugin);
+                },
+                remove(pluginName){
+                    if(!$plugins.has(pluginName)) {
+                        return;
                     }
-                    if(sets.size === 0) {
-                        $pluginByEvents.delete(name);
+                    const plugin = $plugins.get(pluginName);
+                    if(typeof plugin.cleanup === 'function') {
+                        plugin.cleanup();
                     }
-                }
-                $plugins.delete(pluginName);
-            },
-            emit(eventName, ...data) {
-                if(!$pluginByEvents.has(eventName)) {
-                    return;
-                }
-                const plugins = $pluginByEvents.get(eventName);
-
-                for(const plugin of plugins) {
-                    const callback = plugin['on'+eventName];
-                    if(typeof callback === 'function') {
-                        try{
-                            callback.call(plugin, ...data);
-                        } catch (error) {
-                            DebugManager$1.error('Plugin Manager', `Error in plugin ${plugin.$name} for event ${eventName}`, error);
+                    for(const [name, sets] of $pluginByEvents.entries() ) {
+                        if(sets.has(plugin)) {
+                            sets.delete(plugin);
+                        }
+                        if(sets.size === 0) {
+                            $pluginByEvents.delete(name);
+                        }
+                    }
+                    $plugins.delete(pluginName);
+                },
+                emit(eventName, ...data) {
+                    if(!$pluginByEvents.has(eventName)) {
+                        return;
+                    }
+                    const plugins = $pluginByEvents.get(eventName);
+
+                    for(const plugin of plugins) {
+                        const callback = plugin['on'+eventName];
+                        if(typeof callback === 'function') {
+                            try{
+                                callback.call(plugin, ...data);
+                            } catch (error) {
+                                DebugManager$1.error('Plugin Manager', `Error in plugin ${plugin.$name} for event ${eventName}`, error);
+                            }
                         }
                     }
                 }
-            }
-        };
-    }());
+            };
+        }());
+    }
+
+    var PluginsManager = PluginsManager$1;
 
     const ObservableWhen = function(observer, value) {
         this.$target = value;
@@ -322,6 +328,7 @@ var NativeDocument = (function (exports) {
         this.$currentValue = value;
         this.$isCleanedUp = false;
 
+        this.$firstListener = null;
         this.$listeners = null;
         this.$watchers = null;
 
@@ -333,8 +340,9 @@ var NativeDocument = (function (exports) {
                 this.$initialValue = Validator.isObject(value) ? deepClone(value) : value;
             }
         }
-
-        PluginsManager.emit('CreateObservable', this);
+        {
+            PluginsManager.emit('CreateObservable', this);
+        }
     }
 
     Object.defineProperty(ObservableItem.prototype, '$value', {
@@ -357,7 +365,7 @@ var NativeDocument = (function (exports) {
     };
 
     ObservableItem.prototype.triggerFirstListener = function(operations) {
-        this.$listeners[0](this.$currentValue, this.$previousValue, operations || {});
+        this.$firstListener(this.$currentValue, this.$previousValue, operations || {});
     };
 
     ObservableItem.prototype.triggerListeners = function(operations) {
@@ -406,22 +414,29 @@ var NativeDocument = (function (exports) {
     };
 
     ObservableItem.prototype.triggerAll = function(operations) {
-        this.triggerListeners(operations);
         this.triggerWatchers();
+        this.triggerListeners(operations);
     };
 
     ObservableItem.prototype.triggerWatchersAndFirstListener = function(operations) {
-        this.triggerListeners(operations);
         this.triggerWatchers();
+        this.triggerListeners(operations);
     };
 
     ObservableItem.prototype.assocTrigger = function() {
+        this.$firstListener = null;
         if(this.$watchers?.size && this.$listeners?.length) {
             this.trigger = (this.$listeners.length === 1) ? this.triggerWatchersAndFirstListener : this.triggerAll;
             return;
         }
         if(this.$listeners?.length) {
-            this.trigger = (this.$listeners.length === 1) ? this.triggerFirstListener : this.triggerListeners;
+            if(this.$listeners.length === 1) {
+                this.$firstListener = this.$listeners[0];
+                this.trigger = this.triggerFirstListener;
+            }
+            else {
+                this.trigger = this.triggerListeners;
+            }
             return;
         }
         if(this.$watchers?.size) {
@@ -452,10 +467,14 @@ var NativeDocument = (function (exports) {
         }
         this.$previousValue = this.$currentValue;
         this.$currentValue = newValue;
-        PluginsManager.emit('ObservableBeforeChange', this);
+        {
+            PluginsManager.emit('ObservableBeforeChange', this);
+        }
         this.trigger();
         this.$previousValue = null;
-        PluginsManager.emit('ObservableAfterChange', this);
+        {
+            PluginsManager.emit('ObservableAfterChange', this);
+        }
     };
 
     ObservableItem.prototype.val = function() {
@@ -515,11 +534,15 @@ var NativeDocument = (function (exports) {
 
         this.$listeners.push(callback);
         this.assocTrigger();
-        PluginsManager.emit('ObservableSubscribe', this, target);
+        {
+            PluginsManager.emit('ObservableSubscribe', this, target);
+        }
         return () => {
             this.unsubscribe(callback);
             this.assocTrigger();
-            PluginsManager.emit('ObservableUnsubscribe', this);
+            {
+                PluginsManager.emit('ObservableUnsubscribe', this);
+            }
         };
     };
 
@@ -739,7 +762,9 @@ var NativeDocument = (function (exports) {
     function NDElement(element) {
         this.$element = element;
         this.$observer = null;
-        PluginsManager.emit('NDElementCreated', element, this);
+        {
+            PluginsManager.emit('NDElementCreated', element, this);
+        }
     }
 
     NDElement.prototype.__$isNDElement = true;
@@ -908,8 +933,9 @@ var NativeDocument = (function (exports) {
 
             NDElement.prototype[name] = method;
         }
-
-        PluginsManager.emit('NDElementExtended', methods);
+        {
+            PluginsManager.emit('NDElementExtended', methods);
+        }
 
         return NDElement;
     };
@@ -1219,6 +1245,8 @@ var NativeDocument = (function (exports) {
         return anchor;
     }
 
+    DocumentFragment.prototype.setAttribute = () => {};
+
     const BOOLEAN_ATTRIBUTES = new Set([
         'checked',
         'selected',
@@ -1536,7 +1564,9 @@ var NativeDocument = (function (exports) {
 
     Function.prototype.toNdElement = function () {
         const child = this;
-        PluginsManager.emit('BeforeProcessComponent', child);
+        {
+            PluginsManager.emit('BeforeProcessComponent', child);
+        }
         return ElementCreator.getChild(child());
     };
 
@@ -1615,8 +1645,9 @@ var NativeDocument = (function (exports) {
          */
         createElement(name)  {
             if(name) {
-                if($nodeCache.has(name)) {
-                    return $nodeCache.get(name).cloneNode();
+                const cacheNode = $nodeCache.get(name);
+                if(cacheNode) {
+                    return cacheNode.cloneNode();
                 }
                 const node = document.createElement(name);
                 $nodeCache.set(name, node);
@@ -1631,12 +1662,16 @@ var NativeDocument = (function (exports) {
          */
         processChildren(children, parent) {
             if(children === null) return;
-            PluginsManager.emit('BeforeProcessChildren', parent);
+            {
+                PluginsManager.emit('BeforeProcessChildren', parent);
+            }
             let child = this.getChild(children);
             if(child) {
                 parent.appendChild(child);
             }
-            PluginsManager.emit('AfterProcessChildren', parent);
+            {
+                PluginsManager.emit('AfterProcessChildren', parent);
+            }
         },
         getChild(child) {
             if(child == null) {
@@ -1659,7 +1694,6 @@ var NativeDocument = (function (exports) {
          * @param {Object} attributes
          */
         processAttributes(element, attributes) {
-            if(Validator.isFragment(element)) return;
             if (attributes) {
                 AttributesWrapper(element, attributes);
             }
@@ -1672,7 +1706,9 @@ var NativeDocument = (function (exports) {
          * @returns {HTMLElement|DocumentFragment}
          */
         setup(element, attributes, customWrapper) {
-            PluginsManager.emit('Setup', element, attributes, customWrapper);
+            {
+                PluginsManager.emit('Setup', element, attributes, customWrapper);
+            }
             return element;
         }
     };
@@ -2091,13 +2127,8 @@ var NativeDocument = (function (exports) {
         let element = ElementCreator.createElement($tagName);
         let finalElement = (customWrapper && typeof customWrapper === 'function') ? customWrapper(element) : element;
 
-        if(attributes) {
-            ElementCreator.processAttributes(finalElement, attributes);
-        }
-        if(children) {
-            ElementCreator.processChildren(children, finalElement);
-        }
-
+        ElementCreator.processAttributes(finalElement, attributes);
+        ElementCreator.processChildren(children, finalElement);
         return ElementCreator.setup(finalElement, attributes, customWrapper);
     }
 
@@ -2147,14 +2178,6 @@ var NativeDocument = (function (exports) {
         return null;
     };
 
-    const findByPath = (root, path) => {
-        let target = root;
-        for (let i = 0, len = path.length; i < len; i++) {
-            target = target.childNodes[path[i]];
-        }
-        return target;
-    };
-
     const $hydrateFn = function(hydrateFunction, targetType, element, property) {
         if(!cloneBindingsDataCache.has(element)) {
             // { classes, styles, attributes, value, attach }
@@ -2180,27 +2203,43 @@ var NativeDocument = (function (exports) {
         }
     };
 
+
+    const applyBindingTreePath = (root, target, data, path) => {
+        let newTarget = null;
+        if(path.fn) {
+            newTarget = path.fn(data, target, root);
+        }
+        if(path.children) {
+            for(let i = 0, length = path.children.length; i < length; i++) {
+                const currentPath = path.children[i];
+                const pathTargetNode = target.childNodes[currentPath.index];
+                applyBindingTreePath(root, pathTargetNode, data, currentPath);
+            }
+        }
+        return newTarget;
+    };
+
     function TemplateCloner($fn) {
         let $node = null;
         let $hasBindingData = false;
 
-        const $bindingPaths = [];
+        const $bindingTreePath = {
+            fn: null,
+            children: [],
+        };
 
-        const clone = (node, data, path) => {
+        const clone = (node, data, currentPath) => {
             const bindDingData = cloneBindingsDataCache.get(node);
             if(node.nodeType === 3) {
                 if(bindDingData && bindDingData.value) {
-                    $bindingPaths.push({
-                        path: [...path],
-                        fn: (data, targetNode, currentRoot) => {
-                            const newNode = bindDingData.value(data);
-                            targetNode.replaceWith(newNode);
-                            if (targetNode === currentRoot) {
-                                return newNode;
-                            }
-                            return null;
+                    currentPath.fn = (data, targetNode, currentRoot) => {
+                        const newNode = bindDingData.value(data);
+                        if (targetNode === currentRoot) {
+                            return newNode;
                         }
-                    });
+                        targetNode.replaceWith(newNode);
+                        return null;
+                    };
                     return bindDingData.value(data);
                 }
                 return node.cloneNode(true);
@@ -2212,35 +2251,35 @@ var NativeDocument = (function (exports) {
             if(bindDingData) {
                 bindAttributes(nodeCloned, bindDingData, data);
                 bindAttachMethods(nodeCloned, bindDingData, data);
-                $bindingPaths.push({
-                    path: [...path],
-                    fn: (data, targetNode) => {
-                        bindAttributes(targetNode, bindDingData, data);
-                        bindAttachMethods(targetNode, bindDingData, data);
-                    }
-                });
+                currentPath.fn = (data, targetNode) => {
+                    bindAttributes(targetNode, bindDingData, data);
+                    bindAttachMethods(targetNode, bindDingData, data);
+                };
             }
             const childNodes = node.childNodes;
+            const bindingPathChildren = [];
             for(let i = 0, length = childNodes.length; i < length; i++) {
                 const childNode = childNodes[i];
-                path.push(i);
+                const path = { index: i, fn: null };
                 const childNodeCloned = clone(childNode, data, path);
-                path.pop();
+                if(path.children || path.fn) {
+                    bindingPathChildren.push(path);
+                }
                 nodeCloned.appendChild(childNodeCloned);
             }
+            if(bindingPathChildren.length) {
+                currentPath.children = currentPath.children || [];
+                currentPath.children = bindingPathChildren;
+            }
             return nodeCloned;
         };
 
         const cloneWithBindingPaths = (data) => {
             let root = $node.cloneNode(true);
 
-            for (let i = 0, len = $bindingPaths.length; i < len; i++) {
-                const binding = $bindingPaths[i];
-                const target = findByPath(root, binding.path);
-                const newRoot = binding.fn(data, target, root);
-                if(newRoot) {
-                    root = newRoot;
-                }
+            const newRoot = applyBindingTreePath(root, root, data, $bindingTreePath);
+            if(newRoot) {
+                root = newRoot;
             }
 
             return root;
@@ -2253,7 +2292,7 @@ var NativeDocument = (function (exports) {
                 return $node.cloneNode(true);
             }
 
-            const firstClone = clone($node, data, []);
+            const firstClone = clone($node, data, $bindingTreePath);
             this.clone = cloneWithBindingPaths;
             return firstClone;
         };
@@ -2881,7 +2920,9 @@ var NativeDocument = (function (exports) {
         }
 
         ObservableItem.call(this, target, configs);
-        PluginsManager.emit('CreateObservableArray', this);
+        {
+            PluginsManager.emit('CreateObservableArray', this);
+        }
     };
 
     ObservableArray.prototype = Object.create(ObservableItem.prototype);
@@ -2897,7 +2938,7 @@ var NativeDocument = (function (exports) {
 
     mutationMethods.forEach((method) => {
         ObservableArray.prototype[method] = function(...values) {
-            const result = this.$currentValue[method](...values);
+            const result = this.$currentValue[method].apply(this.$currentValue, values);
             this.trigger({ action: method, args: values, result });
             return result;
         };
@@ -2905,7 +2946,7 @@ var NativeDocument = (function (exports) {
 
     noMutationMethods.forEach((method) => {
         ObservableArray.prototype[method] = function(...values) {
-            return this.$currentValue[method](...values);
+            return this.$currentValue[method].apply(this.$currentValue, values);
         };
     });
 
@@ -2923,7 +2964,7 @@ var NativeDocument = (function (exports) {
     };
 
     ObservableArray.prototype.merge = function(values) {
-        this.$currentValue.push(...values);
+        this.$currentValue.push.apply(this.$currentValue, values);
         this.trigger({ action: 'merge',  args: values });
     };
 
@@ -2999,7 +3040,7 @@ var NativeDocument = (function (exports) {
                     const deps = Array.isArray(predicate.dependencies)
                         ? predicate.dependencies
                         : [predicate.dependencies];
-                    observableDependencies.push(...deps);
+                    observableDependencies.push.apply(observableDependencies, deps);
                 }
             } else if(typeof predicate === 'function') {
                 filterCallbacks[key] = predicate;
@@ -3280,8 +3321,9 @@ var NativeDocument = (function (exports) {
         const initialValue = callback();
         const observable = new ObservableItem(initialValue);
         const updatedValue = nextTick(() => observable.set(callback()));
-
-        PluginsManager.emit('CreateObservableComputed', observable, dependencies);
+        {
+            PluginsManager.emit('CreateObservableComputed', observable, dependencies);
+        }
 
         if(Validator.isFunction(dependencies)) {
             if(!Validator.isObservable(dependencies.$observer)) {
@@ -3602,7 +3644,7 @@ var NativeDocument = (function (exports) {
             if(child) {
                 cache.set(item, {
                     child,
-                    indexObserver: (indexObserver ? new WeakRef(indexObserver) : null)
+                    indexObserver
                 });
                 return child;
             }