@xuda.io/runtime-bundle 1.0.831 → 1.0.833

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

@@ -12270,12 +12270,12 @@ func.UI.screen.render_ui_tree = async function (SESSION_ID, $container, nodeP, p
 
         $div.hover(
           function (e) {
-            // hover_in();
-            func.UI.screen.hover_in(SESSION_ID, null, $container, paramsP, is_skeleton);
+            hover_in();
+            // func.UI.screen.hover_in(SESSION_ID, null, $container, paramsP, is_skeleton);
           },
           function (e) {
-            func.UI.screen.hover_out(SESSION_ID, $container, is_skeleton, paramsP);
-            // hover_out();
+            // func.UI.screen.hover_out(SESSION_ID, $container, is_skeleton, paramsP);
+            hover_out();
           },
         );
       }
@@ -12434,12 +12434,12 @@ func.UI.screen.render_ui_tree = async function (SESSION_ID, $container, nodeP, p
 
     $div.hover(
       function (e) {
-        // hover_in($div);
-        func.UI.screen.hover_in(SESSION_ID, $div, $container, paramsP, is_skeleton);
+        hover_in($div);
+        // func.UI.screen.hover_in(SESSION_ID, $div, $container, paramsP, is_skeleton);
       },
       function (e) {
-        func.UI.screen.hover_out(SESSION_ID, $container, is_skeleton, paramsP);
-        // hover_out();
+        // func.UI.screen.hover_out(SESSION_ID, $container, is_skeleton, paramsP);
+        hover_out();
       },
     );
 
@@ -12447,7 +12447,7 @@ func.UI.screen.render_ui_tree = async function (SESSION_ID, $container, nodeP, p
     if (ret.abort || nodeP.tagName === 'svg') return await done();
     // check if iterator made to prevent children render
 
-    const observer = new IntersectionObserver(
+    const observer_inViewport = new IntersectionObserver(
       function (entries) {
         entries.forEach((entry) => {
           if (entry.isIntersecting) {
@@ -12458,7 +12458,7 @@ func.UI.screen.render_ui_tree = async function (SESSION_ID, $container, nodeP, p
             $(entry.target).trigger('inViewport');
 
             // Optional: stop observing once triggered
-            observer.unobserve(entry.target);
+            observer_inViewport.unobserve(entry.target);
           }
         });
       },
@@ -12467,6 +12467,23 @@ func.UI.screen.render_ui_tree = async function (SESSION_ID, $container, nodeP, p
       },
     );
 
+    const observer_outViewport = new IntersectionObserver(
+      function (entries) {
+        entries.forEach((entry) => {
+          if (!entry.isIntersecting) {
+            // Element is OUT of viewport - trigger custom event
+            $(entry.target).trigger('outViewport');
+
+            // Optional: stop observing once triggered
+            // observer_outViewport.unobserve(entry.target);
+          }
+        });
+      },
+      {
+        threshold: 0, // Trigger when element is completely out of view
+      },
+    );
+
     // const render_child = async function () {
     //   await iterate_child($div, nodeP, parent_infoP, $root_container);
     // };
@@ -12475,13 +12492,21 @@ func.UI.screen.render_ui_tree = async function (SESSION_ID, $container, nodeP, p
       // console.log('on>>', 'inViewport_' + $div.attr('xu-ui-id'));
       // $div.on('inViewport_' + $div.attr('xu-ui-id'), function () {
       $div.on('inViewport', function () {
-        func.UI.screen.hover_in(SESSION_ID, $div, $container, paramsP, is_skeleton);
+        hover_in($div);
+        // func.UI.screen.hover_in(SESSION_ID, $div, $container, paramsP, is_skeleton);
         func.UI.worker.add_to_queue(SESSION_ID, 'gui event', 'render_viewport', { $div, nodeP, parent_infoP, $root_container, paramsP, jobNoP, is_skeleton, keyP, refreshed_ds, parent_nodeP, check_existP, $container }, null, null, paramsP.dsSessionP);
         // render_child();
         // iterate_child($div, nodeP, parent_infoP, null, $root_container);
+        observer_outViewport.observe($div[0]);
       });
 
-      observer.observe($div[0]);
+      $div.on('outViewport', function () {
+        $div.empty();
+        observer_inViewport.observe($div[0]);
+      });
+
+      observer_inViewport.observe($div[0]);
+      // observer_outViewport.observe($div[0]);
     } else {
       // await render_child();
       await iterate_child($div, nodeP, parent_infoP, $root_container);
@@ -12533,127 +12558,127 @@ func.UI.screen.refresh_document_changes_for_realtime_update = async function (SE
   }
 };
 
-func.UI.screen.hover_in = function (SESSION_ID, $div, $container, paramsP, is_skeleton) {
-  if (is_skeleton || EXP_BUSY) return;
+// func.UI.screen.hover_in = function (SESSION_ID, $div, $container, paramsP, is_skeleton) {
+//   if (is_skeleton || EXP_BUSY) return;
 
-  var _session = SESSION_OBJ[SESSION_ID];
-  var _ds = _session.DS_GLB[paramsP.dsSessionP];
+//   var _session = SESSION_OBJ[SESSION_ID];
+//   var _ds = _session.DS_GLB[paramsP.dsSessionP];
 
-  const _$ = function ($elm) {
-    try {
-      const id = $elm.attr('xu-ui-id');
-      if (!id) return $elm;
-      const $el = $(`[xu-ui-id="${id}"]`); // $("#" + id);
-
-      if ($el.length > 1) {
-        console.warn('Multiple elements for xu-ui-id: ' + id, $el);
-      }
+//   const _$ = function ($elm) {
+//     try {
+//       const id = $elm.attr('xu-ui-id');
+//       if (!id) return $elm;
+//       const $el = $(`[xu-ui-id="${id}"]`); // $("#" + id);
 
-      return $($el[0]);
-    } catch (e) {
-      console.error(e);
-    }
-  };
+//       if ($el.length > 1) {
+//         console.warn('Multiple elements for xu-ui-id: ' + id, $el);
+//       }
 
-  CLIENT_ACTIVITY_TS = Date.now();
-  if (_$($container)?.data()?.xuData?.debug_info) _$($container).data().xuData.debug_info.hover_item = $div.attr('xu-ui-id');
-  if (!_ds) return;
-  ///////// SET Attributes///////////
-  let attributes = {};
-  $.each($div[0].attributes, function (index, attr) {
-    attributes[attr.name] = attr.value;
-  });
+//       return $($el[0]);
+//     } catch (e) {
+//       console.error(e);
+//     }
+//   };
 
-  SESSION_OBJ[SESSION_ID].DS_GLB[0].data_system.SYS_OBJ_WIN_ELEMENT_HOVERED_ATTRIBUTES = attributes;
-  //////////////////////////////////
-  if (!$div.data()?.xuData) return;
-  const _iterate_info = $div.data().xuData.iterate_info;
-  if (_iterate_info) {
-    if (_iterate_info.is_key_dynamic_field) {
-      _ds.dynamic_fields[_iterate_info.iterator_key].value = _iterate_info._key;
-    } else {
-      try {
-        const row_idx = func.common.find_ROWID_idx(_ds, _ds.currentRecordId);
-        _ds.data_feed.rows[row_idx][_iterate_info.iterator_key] = _iterate_info._key;
-      } catch (err) {
-        console.error(err);
-      }
-    }
+//   CLIENT_ACTIVITY_TS = Date.now();
+//   if (_$($container)?.data()?.xuData?.debug_info) _$($container).data().xuData.debug_info.hover_item = $div.attr('xu-ui-id');
+//   if (!_ds) return;
+//   ///////// SET Attributes///////////
+//   let attributes = {};
+//   $.each($div[0].attributes, function (index, attr) {
+//     attributes[attr.name] = attr.value;
+//   });
 
-    if (_iterate_info.is_val_dynamic_field) {
-      _ds.dynamic_fields[_iterate_info.iterator_val].value = _iterate_info._val;
-    } else {
-      try {
-        const row_idx = func.common.find_ROWID_idx(_ds, _ds.currentRecordId);
-        _ds.data_feed.rows[row_idx][_iterate_info.iterator_val] = _iterate_info._val;
-      } catch (err) {
-        console.error(err);
-      }
-    }
-  }
+//   SESSION_OBJ[SESSION_ID].DS_GLB[0].data_system.SYS_OBJ_WIN_ELEMENT_HOVERED_ATTRIBUTES = attributes;
+//   //////////////////////////////////
+//   if (!$div.data()?.xuData) return;
+//   const _iterate_info = $div.data().xuData.iterate_info;
+//   if (_iterate_info) {
+//     if (_iterate_info.is_key_dynamic_field) {
+//       _ds.dynamic_fields[_iterate_info.iterator_key].value = _iterate_info._key;
+//     } else {
+//       try {
+//         const row_idx = func.common.find_ROWID_idx(_ds, _ds.currentRecordId);
+//         _ds.data_feed.rows[row_idx][_iterate_info.iterator_key] = _iterate_info._key;
+//       } catch (err) {
+//         console.error(err);
+//       }
+//     }
 
-  if ($div && _$($div) && _ds && paramsP.renderType === 'grid') {
-    func.UI.worker.add_to_queue(SESSION_ID, 'gui event', 'update_datasource', { currentRecordId: _$($div).data().xuData.currentRecordId }, null, null, paramsP.dsSessionP);
-  }
+//     if (_iterate_info.is_val_dynamic_field) {
+//       _ds.dynamic_fields[_iterate_info.iterator_val].value = _iterate_info._val;
+//     } else {
+//       try {
+//         const row_idx = func.common.find_ROWID_idx(_ds, _ds.currentRecordId);
+//         _ds.data_feed.rows[row_idx][_iterate_info.iterator_val] = _iterate_info._val;
+//       } catch (err) {
+//         console.error(err);
+//       }
+//     }
+//   }
 
-  const set_value = function (field_id, value) {
-    var currentRecordId = _$($div).data().xuData.currentRecordId;
+//   if ($div && _$($div) && _ds && paramsP.renderType === 'grid') {
+//     func.UI.worker.add_to_queue(SESSION_ID, 'gui event', 'update_datasource', { currentRecordId: _$($div).data().xuData.currentRecordId }, null, null, paramsP.dsSessionP);
+//   }
 
-    func.UI.worker.add_to_queue(
-      SESSION_ID,
-      'gui event',
-      'update_datasource',
-      {
-        currentRecordId,
-        field_id,
-        field_value: value,
-      },
-      null,
-      null,
-      paramsP.dsSessionP,
-    );
-  };
+//   const set_value = function (field_id, value) {
+//     var currentRecordId = _$($div).data().xuData.currentRecordId;
+
+//     func.UI.worker.add_to_queue(
+//       SESSION_ID,
+//       'gui event',
+//       'update_datasource',
+//       {
+//         currentRecordId,
+//         field_id,
+//         field_value: value,
+//       },
+//       null,
+//       null,
+//       paramsP.dsSessionP,
+//     );
+//   };
 
-  if ($div?.data()?.iterate_info) {
-    var data = $div.data().xuData.iterate_info;
-    if (data.iterator_key) {
-      set_value(data.iterator_key, data._key);
-    }
-    if (data.iterator_val) {
-      set_value(data.iterator_val, data._val);
-    }
-  }
-};
-func.UI.screen.hover_out = function (SESSION_ID, $container, is_skeleton, paramsP) {
-  if (is_skeleton || EXP_BUSY) return;
+//   if ($div?.data()?.iterate_info) {
+//     var data = $div.data().xuData.iterate_info;
+//     if (data.iterator_key) {
+//       set_value(data.iterator_key, data._key);
+//     }
+//     if (data.iterator_val) {
+//       set_value(data.iterator_val, data._val);
+//     }
+//   }
+// };
+// func.UI.screen.hover_out = function (SESSION_ID, $container, is_skeleton, paramsP) {
+//   if (is_skeleton || EXP_BUSY) return;
 
-  var _session = SESSION_OBJ[SESSION_ID];
-  var _ds = _session.DS_GLB[paramsP.dsSessionP];
+//   var _session = SESSION_OBJ[SESSION_ID];
+//   var _ds = _session.DS_GLB[paramsP.dsSessionP];
 
-  const _$ = function ($elm) {
-    try {
-      const id = $elm.attr('xu-ui-id');
-      if (!id) return $elm;
-      const $el = $(`[xu-ui-id="${id}"]`); // $("#" + id);
+//   const _$ = function ($elm) {
+//     try {
+//       const id = $elm.attr('xu-ui-id');
+//       if (!id) return $elm;
+//       const $el = $(`[xu-ui-id="${id}"]`); // $("#" + id);
 
-      if ($el.length > 1) {
-        console.warn('Multiple elements for xu-ui-id: ' + id, $el);
-      }
+//       if ($el.length > 1) {
+//         console.warn('Multiple elements for xu-ui-id: ' + id, $el);
+//       }
 
-      return $($el[0]);
-    } catch (e) {
-      console.error(e);
-    }
-  };
+//       return $($el[0]);
+//     } catch (e) {
+//       console.error(e);
+//     }
+//   };
 
-  CLIENT_ACTIVITY_TS = Date.now();
-  if (_$($container)?.data()?.xuData?.debug_info) {
-    _$($container).data().xuData.debug_info.hover_item = null;
-  }
-  if (_ds?.data_system) {
-    SESSION_OBJ[SESSION_ID].DS_GLB[0].data_system.SYS_OBJ_WIN_ELEMENT_HOVERED_ATTRIBUTES = {};
-  }
-};
+//   CLIENT_ACTIVITY_TS = Date.now();
+//   if (_$($container)?.data()?.xuData?.debug_info) {
+//     _$($container).data().xuData.debug_info.hover_item = null;
+//   }
+//   if (_ds?.data_system) {
+//     SESSION_OBJ[SESSION_ID].DS_GLB[0].data_system.SYS_OBJ_WIN_ELEMENT_HOVERED_ATTRIBUTES = {};
+//   }
+// };
  func.UI.component = {};
 
 func.UI.component.create_app_modal_component = function (