native-document 1.0.63 → 1.0.65

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "native-document",
-  "version": "1.0.63",
+  "version": "1.0.65",
   "main": "index.js",
   "type": "module",
   "scripts": {

package/src/devtools/hrm/ComponentRegistry.js

@@ -1,8 +1,31 @@
 import {Anchor} from "../../../elements.js";
+import Validator from "../../utils/validator";
 
 const ComponentRegistry = (function() {
     const registry = new Map();
 
+    const attachLocalExtensions = (instance, factoryInstance) => {
+        if(!factoryInstance.$localExtensions) {
+            return;
+        }
+        const extensions = Object.fromEntries(factoryInstance.$localExtensions);
+        for(const name in extensions) {
+            instance.anchor[name] = function() {
+                const result = extensions[name](...arguments);
+                if(result === null || result === undefined) {
+                    return instance.anchor;
+                }
+                if(Validator.isFragment(result) || Validator.isElement(result) || Validator.isNDElement(result)) {
+                    instance.anchor.setContent(result);
+                    return instance.anchor;
+                }
+                return result;
+            };
+        }
+        instance.anchor.$localExtensions = factoryInstance.$localExtensions;
+        instance.extensions = Object.keys(extensions);
+    };
+
     const wrapper = function(id, factory, metadata, registryItem) {
         const factoryName = factory.name;
 
@@ -10,13 +33,21 @@ const ComponentRegistry = (function() {
             const firstParam = args[0];
             if(firstParam?.__instance) {
                 const instance = firstParam.__instance;
-                const newInstance = factory(...instance.context.args, instance);
-                instance.anchor.setContent(newInstance);
+                const newFactoryInstance = factory(...instance.context.args, instance);
+
+                if(instance.extensions) {
+                    instance.extensions.forEach((extensionName) => {
+                        instance.anchor[extensionName] = undefined;
+                    });
+                }
+                attachLocalExtensions(instance, newFactoryInstance);
+                instance.anchor.setContent(newFactoryInstance);
                 return;
             }
             const anchor = Anchor(factoryName);
             const instance = {
                 anchor,
+                extensions: null,
                 context: {
                     args,
                     states: new Map()
@@ -25,6 +56,8 @@ const ComponentRegistry = (function() {
             const factoryInstance = factory(...args, instance);
             anchor.setContent(factoryInstance);
             registryItem.instances.add(instance);
+
+            attachLocalExtensions(instance, factoryInstance);
             return anchor;
         };
     }

package/src/devtools/hrm/hrm.hook.template.js

@@ -17,12 +17,6 @@ if (import.meta.hot) {
             return;
         }
 
-        // const NativeDocument = window.NativeDocument;
-        // if (!NativeDocument) {
-        //     console.error('[HMR Browser] NativeDocument not found on window!');
-        //     return;
-        // }
-
         if (!ComponentRegistry) {
             console.error('[HMR Browser] ComponentRegistry not found!');
             return;

package/src/devtools/hrm/hrm.orbservable.hook.template.js

@@ -1,5 +1,8 @@
 
 function Observable(name, instance, value, ...args) {
+    if(!instance?.context) {
+        return __OriginalObservable__(value, ...args);
+    }
     if(instance.context.states.has(name)) {
         const item =  instance.context.states.get(name);
         if(item.value !== value) {
@@ -18,6 +21,9 @@ function Observable(name, instance, value, ...args) {
 };
 
 Observable.init = function(name, instance, value, ...args) {
+    if(!instance?.context) {
+        return __OriginalObservable__.init(value, ...args);
+    }
     if(instance.context.states.has(name)) {
         const item = instance.context.states.get(name);
 
@@ -37,6 +43,9 @@ Observable.init = function(name, instance, value, ...args) {
 };
 
 Observable.array = function(name, instance, value, ...args) {
+    if(!instance?.context) {
+        return __OriginalObservable__.array(value, ...args);
+    }
     if(instance.context.states.has(name)) {
         const item = instance.context.states.get(name);
         if(item.value !== JSON.stringify(value)) {

package/src/devtools/hrm/transformComponent.js

@@ -53,11 +53,11 @@ function transformObservableImports(code, params) {
 }
 
 function transformObservableDeclarations(code) {
-    const regex = /const\s+(\w+)\s*=\s*(\$|Observable)(\.(?:init|array|json))?\s*\(/g;
+    const regex = /(const|let|var)\s+([\w$]+)\s*=\s*(\$|Observable)(\.(?:init|array|json))?\s*\(/g;
 
-    return code.replace(regex, (match, varName, caller, method) => {
+    return code.replace(regex, (match, varType, varName, caller, method) => {
         const obsName = method ? `${caller}${method}` : 'Observable';
-        return `const ${varName} = ${obsName}('${varName}', arguments[arguments.length - 1], `;
+        return `${varType} ${varName} = ${obsName}('${varName}', arguments[arguments.length - 1], `;
     });
 }
 

package/src/wrappers/NDElement.js

@@ -243,7 +243,7 @@ NDElement.prototype.with = function(methods) {
             this.$localExtensions.set(name, method);
         }
 
-        this[name] = method;
+        this[name] = method.bind(this);
     }
 
     return this;