native-document 1.0.66 → 1.0.68

package/dist/native-document.dev.js

@@ -1,10 +1,10 @@
 var NativeDocument = (function (exports) {
     'use strict';
 
-    let DebugManager = {};
+    let DebugManager$1 = {};
 
     {
-        DebugManager = {
+        DebugManager$1 = {
             enabled: false,
 
             enable() {
@@ -35,7 +35,7 @@ var NativeDocument = (function (exports) {
         };
 
     }
-    var DebugManager$1 = DebugManager;
+    var DebugManager = DebugManager$1;
 
     const MemoryManager = (function() {
 
@@ -84,7 +84,7 @@ var NativeDocument = (function (exports) {
                     }
                 }
                 if (cleanedCount > 0) {
-                    DebugManager$1.log('Memory Auto Clean', `🧹 Cleaned ${cleanedCount} orphaned observables`);
+                    DebugManager.log('Memory Auto Clean', `🧹 Cleaned ${cleanedCount} orphaned observables`);
                 }
             }
         };
@@ -207,7 +207,7 @@ var NativeDocument = (function (exports) {
                         try{
                             callback.call(plugin, ...data);
                         } catch (error) {
-                            DebugManager$1.error('Plugin Manager', `Error in plugin ${plugin.$name} for event ${eventName}`, error);
+                            DebugManager.error('Plugin Manager', `Error in plugin ${plugin.$name} for event ${eventName}`, error);
                         }
                     }
                 }
@@ -459,7 +459,7 @@ var NativeDocument = (function (exports) {
     ObservableItem.prototype.subscribe = function(callback, target = null) {
         this.$listeners = this.$listeners ?? [];
         if (this.$isCleanedUp) {
-            DebugManager$1.warn('Observable subscription', '⚠️ Attempted to subscribe to a cleaned up observable.');
+            DebugManager.warn('Observable subscription', '⚠️ Attempted to subscribe to a cleaned up observable.');
             return () => {};
         }
         if (typeof callback !== 'function') {
@@ -575,30 +575,56 @@ var NativeDocument = (function (exports) {
         unmounted: new WeakMap(),
         unmountedSupposedSize: 0,
         observer: null,
+        executeMountedCallback(node) {
+            const data = DocumentObserver.mounted.get(node);
+            if(!data) {
+                return;
+            }
+            data.inDom = true;
+            data.mounted && data.mounted(node);
+        },
+        executeUnmountedCallback(node) {
+            const data = DocumentObserver.unmounted.get(node);
+            if(!data) {
+                return;
+            }
+
+            data.inDom = false;
+            if(data.unmounted && data.unmounted(node) === true) {
+                data.disconnect();
+                node.nd?.remove();
+            }
+        },
         checkMutation: function(mutationsList) {
             for(const mutation of mutationsList) {
                 if(DocumentObserver.mountedSupposedSize > 0 ) {
                     for(const node of mutation.addedNodes) {
-                        const data = DocumentObserver.mounted.get(node);
-                        if(!data) {
-                            continue;
+                        DocumentObserver.executeMountedCallback(node);
+                        if(!node.querySelectorAll) {
+                            return;
+                        }
+                        const children = node.querySelectorAll('[data--nd-mounted]');
+                        if(!children.length) {
+                            return;
+                        }
+                        for(const node of children) {
+                            DocumentObserver.executeMountedCallback(node);
                         }
-                        data.inDom = true;
-                        data.mounted && data.mounted(node);
                     }
                 }
 
                 if(DocumentObserver.unmountedSupposedSize > 0 ) {
                     for(const node of mutation.removedNodes) {
-                        const data = DocumentObserver.unmounted.get(node);
-                        if(!data) {
-                            continue;
+                        DocumentObserver.executeUnmountedCallback(node);
+                        if(!node.querySelectorAll) {
+                            return;
                         }
-
-                        data.inDom = false;
-                        if(data.unmounted && data.unmounted(node) === true) {
-                            data.disconnect();
-                            node.nd?.remove();
+                        const children = node.querySelectorAll('[data--nd-unmounted]');
+                        if(!children.length) {
+                            return;
+                        }
+                        for(const node of children) {
+                            DocumentObserver.executeUnmountedCallback(node);
                         }
                     }
                 }
@@ -732,6 +758,7 @@ var NativeDocument = (function (exports) {
         this.$observer = null;
         PluginsManager.emit('NDElementCreated', element, this);
     }
+
     NDElement.prototype.__$isNDElement = true;
 
     NDElement.prototype.valueOf = function() {
@@ -775,10 +802,17 @@ var NativeDocument = (function (exports) {
     NDElement.prototype.lifecycle = function(states) {
         this.$observer = this.$observer || DocumentObserver.watch(this.$element);
 
-        states.mounted && this.$observer.mounted(states.mounted);
-        states.unmounted && this.$observer.unmounted(states.unmounted);
+        if(states.mounted) {
+            this.$element.setAttribute('data--nd-mounted', '1');
+            this.$observer.mounted(states.mounted);
+        }
+        if(states.unmounted) {
+            this.$element.setAttribute('data--nd-unmounted', '1');
+            this.$observer.unmounted(states.unmounted);
+        }
         return this;
     };
+
     NDElement.prototype.mounted = function(callback) {
         return this.lifecycle({ mounted: callback });
     };
@@ -808,9 +842,11 @@ var NativeDocument = (function (exports) {
 
         return this;
     };
+
     NDElement.prototype.openShadow = function(style = null) {
         return this.shadow('open', style);
     };
+
     NDElement.prototype.closedShadow = function(style = null) {
         return this.shadow('closed', style);
     };
@@ -878,7 +914,6 @@ var NativeDocument = (function (exports) {
         });
     };
 
-
     const preventDefaultWrapper = function(element, eventName, callback) {
         element.addEventListener(eventName, (event) => {
             event.preventDefault();
@@ -886,6 +921,7 @@ var NativeDocument = (function (exports) {
         });
         return this;
     };
+
     const stopPropagationWrapper = function(element, eventName, callback) {
         element.addEventListener(eventName, (event) => {
             event.stopPropagation();
@@ -893,6 +929,7 @@ var NativeDocument = (function (exports) {
         });
         return this;
     };
+
     const preventDefaultAndStopPropagationWrapper = function(element, eventName, callback) {
         element.addEventListener(eventName, (event) => {
             event.stopPropagation();
@@ -901,6 +938,7 @@ var NativeDocument = (function (exports) {
         });
         return this;
     };
+
     const captureEventWrapper = function(element, eventName, directHandler) {
         if(directHandler) {
             element.addEventListener(eventName, directHandler);
@@ -916,14 +954,17 @@ var NativeDocument = (function (exports) {
             this.$element.addEventListener(eventName, callback);
             return this;
         };
+
         NDElement.prototype['onPrevent'+event] = function(callback) {
             preventDefaultWrapper(this.$element, eventName, callback);
             return this;
         };
+
         NDElement.prototype['onStop'+event] = function(callback) {
             stopPropagationWrapper(this.$element, eventName, callback);
             return this;
         };
+
         NDElement.prototype['onPreventStop'+event] = function(callback) {
             preventDefaultAndStopPropagationWrapper(this.$element, eventName, callback);
             return this;
@@ -959,7 +1000,7 @@ var NativeDocument = (function (exports) {
             }
             {
                 if (this[name] && !this.$localExtensions.has(name)) {
-                    DebugManager$1.warn('NDElement.extend', `Method "${name}" already exists and will be overwritten`);
+                    DebugManager.warn('NDElement.extend', `Method "${name}" already exists and will be overwritten`);
                 }
                 this.$localExtensions.set(name, method);
             }
@@ -993,17 +1034,17 @@ var NativeDocument = (function (exports) {
             const method = methods[name];
 
             if (typeof method !== 'function') {
-                DebugManager$1.warn('NDElement.extend', `"${name}" is not a function, skipping`);
+                DebugManager.warn('NDElement.extend', `"${name}" is not a function, skipping`);
                 continue;
             }
 
             if (protectedMethods.has(name)) {
-                DebugManager$1.error('NDElement.extend', `Cannot override protected method "${name}"`);
+                DebugManager.error('NDElement.extend', `Cannot override protected method "${name}"`);
                 throw new NativeDocumentError(`Cannot override protected method "${name}"`);
             }
 
             if (NDElement.prototype[name]) {
-                DebugManager$1.warn('NDElement.extend', `Overwriting existing prototype method "${name}"`);
+                DebugManager.warn('NDElement.extend', `Overwriting existing prototype method "${name}"`);
             }
 
             NDElement.prototype[name] = method;
@@ -1149,7 +1190,7 @@ var NativeDocument = (function (exports) {
             const foundReserved = Object.keys(attributes).filter(key => reserved.includes(key));
 
             if (foundReserved.length > 0) {
-                DebugManager$1.warn('Validator', `Reserved attributes found: ${foundReserved.join(', ')}`);
+                DebugManager.warn('Validator', `Reserved attributes found: ${foundReserved.join(', ')}`);
             }
 
             return attributes;
@@ -1197,7 +1238,7 @@ var NativeDocument = (function (exports) {
         element.appendChild = function(child, before = null) {
             const parent = anchorEnd.parentNode;
             if(!parent) {
-                DebugManager$1.error('Anchor', 'Anchor : parent not found', child);
+                DebugManager.error('Anchor', 'Anchor : parent not found', child);
                 return;
             }
             before = before ?? anchorEnd;
@@ -2781,7 +2822,7 @@ var NativeDocument = (function (exports) {
                 }
                 cache.set(keyId, { keyId, isNew: true, child: new WeakRef(child), indexObserver});
             } catch (e) {
-                DebugManager$1.error('ForEach', `Error creating element for key ${keyId}` , e);
+                DebugManager.error('ForEach', `Error creating element for key ${keyId}` , e);
                 throw e;
             }
             return keyId;
@@ -3153,7 +3194,7 @@ var NativeDocument = (function (exports) {
      */
     const ShowIf = function(condition, child, { comment = null, shouldKeepInCache = true} = {}) {
         if(!(Validator.isObservable(condition)) && !Validator.isObservableWhenResult(condition)) {
-            return DebugManager$1.warn('ShowIf', "ShowIf : condition must be an Observable / "+comment, condition);
+            return DebugManager.warn('ShowIf', "ShowIf : condition must be an Observable / "+comment, condition);
         }
         const element = Anchor('Show if : '+(comment || ''));
 
@@ -3940,7 +3981,7 @@ var NativeDocument = (function (exports) {
                 window.history.pushState({ name: route.name(), params, path}, route.name() || path , path);
                 this.handleRouteChange(route, params, query, path);
             } catch (e) {
-                DebugManager$1.error('HistoryRouter', 'Error in pushState', e);
+                DebugManager.error('HistoryRouter', 'Error in pushState', e);
             }
         };
         /**
@@ -3953,7 +3994,7 @@ var NativeDocument = (function (exports) {
                 window.history.replaceState({ name: route.name(), params, path}, route.name() || path , path);
                 this.handleRouteChange(route, params, {}, path);
             } catch(e) {
-                DebugManager$1.error('HistoryRouter', 'Error in replaceState', e);
+                DebugManager.error('HistoryRouter', 'Error in replaceState', e);
             }
         };
         this.forward = function() {
@@ -3980,7 +4021,7 @@ var NativeDocument = (function (exports) {
                     }
                     this.handleRouteChange(route, params, query, path);
                 } catch(e) {
-                    DebugManager$1.error('HistoryRouter', 'Error in popstate event', e);
+                    DebugManager.error('HistoryRouter', 'Error in popstate event', e);
                 }
             });
             const { route, params, query, path } = this.resolve(defaultPath || (window.location.pathname+window.location.search));
@@ -4134,7 +4175,7 @@ var NativeDocument = (function (exports) {
                     listener(request);
                     next && next(request);
                 } catch (e) {
-                    DebugManager$1.warn('Route Listener', 'Error in listener:', e);
+                    DebugManager.warn('Route Listener', 'Error in listener:', e);
                 }
             }
         };
@@ -4293,7 +4334,7 @@ var NativeDocument = (function (exports) {
      */
     Router.create = function(options, callback) {
         if(!Validator.isFunction(callback)) {
-            DebugManager$1.error('Router', 'Callback must be a function', e);
+            DebugManager.error('Router', 'Callback must be a function', e);
             throw new RouterError('Callback must be a function');
         }
         const router = new Router(options);