@xuda.io/runtime-bundle 1.0.388 → 1.0.389

package/js/xuda-runtime-slim.js

@@ -11957,16 +11957,81 @@ func.UI.screen.execute_xu_functions = async function (SESSION_ID, is_skeleton, $
 
       // create a new instance of `MutationObserver` named `observer`,
       // passing it a callback function
-      const observer = new MutationObserver(() => {
-        console.log('callback that runs when observer is triggered');
-      });
+      // const observer = new MutationObserver(() => {
+      //   console.log('callback that runs when observer is triggered');
+      // });
+
+      // // call `observe()`, passing it the element to observe, and the options object
+      // observer.observe(_session.DS_GLB[paramsP.dsSessionP], {
+      //   subtree: true,
+      //   childList: true,
+      // });
+      //==================
+      class ObjectObserver {
+        constructor(targetObject, callback) {
+          this.callback = callback;
+          this.target = targetObject;
+
+          // Create a proxy to intercept property access and modifications
+          this.proxy = new Proxy(targetObject, {
+            set: (target, property, value) => {
+              const oldValue = target[property];
+              target[property] = value;
+
+              // Call the callback with mutation information
+              this.callback({
+                type: 'update',
+                object: target,
+                property,
+                oldValue,
+                newValue: value,
+              });
+
+              return true;
+            },
+
+            deleteProperty: (target, property) => {
+              const oldValue = target[property];
+              const deleted = delete target[property];
+
+              if (deleted) {
+                this.callback({
+                  type: 'delete',
+                  object: target,
+                  property,
+                  oldValue,
+                });
+              }
+
+              return deleted;
+            },
+          });
+
+          return this.proxy;
+        }
 
-      // call `observe()`, passing it the element to observe, and the options object
-      observer.observe(_session.DS_GLB[paramsP.dsSessionP], {
-        subtree: true,
-        childList: true,
+        // Method to stop observing (for cleanup)
+        disconnect() {
+          this.callback = null;
+          this.target = null;
+          this.proxy = null;
+        }
+      }
+
+      // Usage example:
+      const originalObject = _session.DS_GLB[paramsP.dsSessionP];
+
+      // Create observer with callback
+      const observedObject = new ObjectObserver(originalObject, (mutation) => {
+        console.log('Change detected:', mutation);
       });
 
+      // // These operations will trigger the callback
+      // observedObject.name = "Jane";       // Property update
+      // observedObject.job = "Developer";   // Property addition
+      // delete observedObject.age;          // Property deletion
+      //==================
+
       return {};
     },
     'xu-bind': async function ($elm, val) {

package/js/xuda-runtime-slim.min.es.js

@@ -10030,16 +10030,81 @@ func.UI.screen.execute_xu_functions = async function (SESSION_ID, is_skeleton, $
 
       // create a new instance of `MutationObserver` named `observer`,
       // passing it a callback function
-      const observer = new MutationObserver(() => {
-        console.log('callback that runs when observer is triggered');
-      });
+      // const observer = new MutationObserver(() => {
+      //   console.log('callback that runs when observer is triggered');
+      // });
+
+      // // call `observe()`, passing it the element to observe, and the options object
+      // observer.observe(_session.DS_GLB[paramsP.dsSessionP], {
+      //   subtree: true,
+      //   childList: true,
+      // });
+      //==================
+      class ObjectObserver {
+        constructor(targetObject, callback) {
+          this.callback = callback;
+          this.target = targetObject;
+
+          // Create a proxy to intercept property access and modifications
+          this.proxy = new Proxy(targetObject, {
+            set: (target, property, value) => {
+              const oldValue = target[property];
+              target[property] = value;
+
+              // Call the callback with mutation information
+              this.callback({
+                type: 'update',
+                object: target,
+                property,
+                oldValue,
+                newValue: value,
+              });
+
+              return true;
+            },
+
+            deleteProperty: (target, property) => {
+              const oldValue = target[property];
+              const deleted = delete target[property];
+
+              if (deleted) {
+                this.callback({
+                  type: 'delete',
+                  object: target,
+                  property,
+                  oldValue,
+                });
+              }
+
+              return deleted;
+            },
+          });
+
+          return this.proxy;
+        }
 
-      // call `observe()`, passing it the element to observe, and the options object
-      observer.observe(_session.DS_GLB[paramsP.dsSessionP], {
-        subtree: true,
-        childList: true,
+        // Method to stop observing (for cleanup)
+        disconnect() {
+          this.callback = null;
+          this.target = null;
+          this.proxy = null;
+        }
+      }
+
+      // Usage example:
+      const originalObject = _session.DS_GLB[paramsP.dsSessionP];
+
+      // Create observer with callback
+      const observedObject = new ObjectObserver(originalObject, (mutation) => {
+        console.log('Change detected:', mutation);
       });
 
+      // // These operations will trigger the callback
+      // observedObject.name = "Jane";       // Property update
+      // observedObject.job = "Developer";   // Property addition
+      // delete observedObject.age;          // Property deletion
+      //==================
+
       return {};
     },
     'xu-bind': async function ($elm, val) {