@lvce-editor/virtual-dom 6.2.0 → 6.4.0

package/dist/index.d.ts

@@ -45,7 +45,7 @@ export interface TextPatch {
 	readonly value: string;
 }
 export type Patch = TextPatch | AttributePatch | ReplacePatch | RemoveAttributePatch | RemovePatch | AddPatch | NavigateChildPatch | NavigateParentPatch | RemoveChildPatch | NavigateSiblingPatch;
-export declare const applyPatch: ($Element: Node, patches: readonly Patch[], eventMap?: Record<string, any>) => void;
+export declare const applyPatch: ($Element: Node, patches: readonly Patch[], eventMap?: Record<string, any>, id?: any) => void;
 export declare const setComponentUid: ($Element: any, uid: any) => void;
 export declare const getComponentUid: ($Element: any) => number;
 export declare const getComponentUidFromEvent: (event: any) => number;

package/dist/index.js

@@ -720,7 +720,15 @@ const replace = ($Element, nodes, eventMap = {}) => {
   const $Temp = document.createElement('div');
   renderInternal($Temp, nodes, eventMap, eventMap);
   // Replace the current element with the new ones
-  const $NewElement = $Temp.firstElementChild;
+  let $NewElement = $Temp.firstElementChild;
+  if (!$NewElement) {
+    // If no element was created (e.g., only text nodes), we need to create a wrapper
+    // In this case, we create a div and move all children to it
+    $NewElement = document.createElement('div');
+    while ($Temp.firstChild) {
+      $NewElement.append($Temp.firstChild);
+    }
+  }
   $Element.replaceWith($NewElement);
   return $NewElement;
 };
@@ -735,41 +743,6 @@ const NavigateParent = 8;
 const RemoveChild = 9;
 const NavigateSibling = 10;
 
-const applyPatch = ($Element, patches, eventMap = {}) => {
-  let $Current = $Element;
-  for (const patch of patches) {
-    switch (patch.type) {
-      case Add:
-        add$1($Current, patch.nodes, eventMap);
-        break;
-      case NavigateChild:
-        $Current = $Current.childNodes[patch.index];
-        break;
-      case NavigateParent:
-        $Current = $Current.parentNode;
-        break;
-      case NavigateSibling:
-        $Current = $Current.parentNode.childNodes[patch.index];
-        break;
-      case RemoveAttribute:
-        removeAttribute($Current, patch.key);
-        break;
-      case RemoveChild:
-        removeChild($Current, patch.index);
-        break;
-      case Replace:
-        $Current = replace($Current, patch.nodes, eventMap);
-        break;
-      case SetAttribute:
-        setProp($Current, patch.key, patch.value, eventMap);
-        break;
-      case SetText:
-        setText($Current, patch.value);
-        break;
-    }
-  }
-};
-
 const dragInfos = Object.create(null);
 const setDragInfo = (id, data) => {
   dragInfos[id] = data;
@@ -784,32 +757,6 @@ const isDragInfoOld = data => {
   return Array.isArray(data);
 };
 
-let id = 0;
-const create = () => {
-  return ++id;
-};
-
-const state = Object.create(null);
-const acquire = id => {
-  const promise = state[id];
-  delete state[id];
-  return promise;
-};
-const getFileHandles = async ids => {
-  const promises = ids.map(acquire);
-  const handles = await Promise.all(promises);
-  return handles;
-};
-const add = promise => {
-  const id = create();
-  state[id] = promise;
-  return id;
-};
-const addFileHandle = fileHandle => {
-  const promise = Promise.resolve(fileHandle);
-  return add(promise);
-};
-
 const setDragImage = (dataTransfer, label) => {
   const dragImage = document.createElement('div');
   dragImage.className = 'DragImage';
@@ -862,6 +809,32 @@ const enabled = () => {
   return ignore;
 };
 
+let id = 0;
+const create = () => {
+  return ++id;
+};
+
+const state = Object.create(null);
+const acquire = id => {
+  const promise = state[id];
+  delete state[id];
+  return promise;
+};
+const getFileHandles = async ids => {
+  const promises = ids.map(acquire);
+  const handles = await Promise.all(promises);
+  return handles;
+};
+const add = promise => {
+  const id = create();
+  state[id] = promise;
+  return id;
+};
+const addFileHandle = fileHandle => {
+  const promise = Promise.resolve(fileHandle);
+  return add(promise);
+};
+
 const unwrapItemString = async item => {
   const {
     resolve,
@@ -1056,6 +1029,87 @@ const getEventListenerMap = id => {
   return map;
 };
 
+const applyPatch = ($Element, patches, eventMap = {}, id = 0) => {
+  const events = getEventListenerMap(id) || eventMap;
+  let $Current = $Element;
+  for (let patchIndex = 0; patchIndex < patches.length; patchIndex++) {
+    const patch = patches[patchIndex];
+    try {
+      switch (patch.type) {
+        case Add:
+          add$1($Current, patch.nodes, events);
+          break;
+        case NavigateChild:
+          {
+            const $Child = $Current.childNodes[patch.index];
+            if (!$Child) {
+              console.error('Cannot navigate to child: child not found at index', {
+                $Current,
+                index: patch.index,
+                childCount: $Current.childNodes.length
+              });
+              return;
+            }
+            $Current = $Child;
+            break;
+          }
+        case NavigateParent:
+          {
+            const $Parent = $Current.parentNode;
+            if (!$Parent) {
+              console.error('Cannot navigate to parent: current node has no parent', {
+                $Current
+              });
+              return;
+            }
+            $Current = $Parent;
+            break;
+          }
+        case NavigateSibling:
+          {
+            const $Parent = $Current.parentNode;
+            if (!$Parent) {
+              console.error('Cannot navigate to sibling: current node has no parent', {
+                patchIndex
+              });
+              return;
+            }
+            $Current = $Parent.childNodes[patch.index];
+            if (!$Current) {
+              console.error('Cannot navigate to sibling: sibling not found at index', {
+                $Parent,
+                index: patch.index,
+                childCount: $Parent.childNodes.length
+              });
+              return;
+            }
+            break;
+          }
+        case RemoveAttribute:
+          removeAttribute($Current, patch.key);
+          break;
+        case RemoveChild:
+          removeChild($Current, patch.index);
+          break;
+        case Replace:
+          $Current = replace($Current, patch.nodes, events);
+          break;
+        case SetAttribute:
+          setProp($Current, patch.key, patch.value, events);
+          break;
+        case SetText:
+          setText($Current, patch.value);
+          break;
+        default:
+          break;
+      }
+    } catch (error) {
+      console.error('Error applying patch at index ' + patchIndex, patch, error);
+      throw error;
+    }
+  }
+};
+
 const getActiveElementInside = $Viewlet => {
   if (!$Viewlet) {
     return undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/virtual-dom",
-  "version": "6.2.0",
+  "version": "6.4.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/lvce-editor/virtual-dom.git"