@elementor/editor-components 4.3.0-1034 → 4.3.0-1036

package/dist/index.js

@@ -2650,7 +2650,7 @@ var import_editor_canvas5 = require("@elementor/editor-canvas");
 var import_editor_documents4 = require("@elementor/editor-documents");
 var import_editor_notifications2 = require("@elementor/editor-notifications");
 var import_store23 = require("@elementor/store");
-var import_utils5 = require("@elementor/utils");
+var import_utils6 = require("@elementor/utils");
 var import_i18n13 = require("@wordpress/i18n");
 
 // src/utils/format-component-elements-id.ts
@@ -2669,9 +2669,66 @@ function formatComponentElementsId(elements, path) {
   });
 }
 
+// src/utils/reconcile-component-instance-elements.ts
+var import_editor_elements8 = require("@elementor/editor-elements");
+var import_utils5 = require("@elementor/utils");
+var ELEMENT_ID_LENGTH2 = 7;
+function overridesRecordToMapping(overrides) {
+  const mapping = {};
+  for (const [key, value] of Object.entries(overrides)) {
+    mapping[key] = { value };
+  }
+  return mapping;
+}
+function getElementConfig(element) {
+  const type = element.elType === "widget" ? element.widgetType : element.elType;
+  if (!type) {
+    return void 0;
+  }
+  return (0, import_editor_elements8.getWidgetsCache)()?.[type];
+}
+function deriveIds(element, seed) {
+  const id = (0, import_utils5.hashString)(seed, ELEMENT_ID_LENGTH2);
+  return {
+    ...element,
+    id,
+    elements: (element.elements ?? []).map((child, index) => deriveIds(child, `${id}_${index}`))
+  };
+}
+function reconcileElementTree(element, overridesMapping) {
+  const elementConfig = getElementConfig(element);
+  const withOverrides = applyOverridesToSettings(element.settings ?? {}, overridesMapping);
+  const effectiveSettings = unwrapOverridableSettings(withOverrides);
+  const originalChildren = element.elements ?? [];
+  const originalChildIds = new Set(originalChildren.map((child) => child.id));
+  const attributes = {
+    elements: [...originalChildren],
+    settings: effectiveSettings
+  };
+  if (elementConfig?.children_dependencies?.length) {
+    (0, import_editor_elements8.reconcileInitialChildren)({
+      elementId: element.id,
+      elementConfig,
+      attributes
+    });
+  }
+  const reconciledChildren = (attributes.elements ?? []).map(
+    (child) => originalChildIds.has(child.id) ? child : deriveIds(child, `${element.id}_${child.elType}`)
+  ).map((child) => reconcileElementTree(child, overridesMapping));
+  return {
+    ...element,
+    settings: effectiveSettings,
+    elements: reconciledChildren
+  };
+}
+function reconcileComponentInstanceElements(elements, overrides = {}) {
+  const overridesMapping = overridesRecordToMapping(overrides);
+  return elements.map((element) => reconcileElementTree(element, overridesMapping));
+}
+
 // src/utils/switch-to-component.ts
 var import_editor_documents3 = require("@elementor/editor-documents");
-var import_editor_elements8 = require("@elementor/editor-elements");
+var import_editor_elements9 = require("@elementor/editor-elements");
 var import_editor_v1_adapters3 = require("@elementor/editor-v1-adapters");
 async function switchToComponent(componentId, componentInstanceId, element) {
   const selector = getSelector(element, componentInstanceId);
@@ -2683,10 +2740,10 @@ async function switchToComponent(componentId, componentInstanceId, element) {
     shouldScroll: false
   });
   await loadComponentsOverridableProps([componentId], { force: true });
-  const currentDocumentContainer = (0, import_editor_elements8.getCurrentDocumentContainer)();
+  const currentDocumentContainer = (0, import_editor_elements9.getCurrentDocumentContainer)();
   const topLevelElement = currentDocumentContainer?.children?.[0];
   if (topLevelElement) {
-    (0, import_editor_elements8.selectElement)(topLevelElement.id);
+    (0, import_editor_elements9.selectElement)(topLevelElement.id);
     expandNavigator();
   }
 }
@@ -2845,7 +2902,11 @@ function createComponentView(options) {
         };
         const instanceId = this.model.get("id");
         const elements = componentInstance.elements ?? [];
-        const formattedElements = formatComponentElementsId(elements, [instanceId]);
+        const reconciledElements = reconcileComponentInstanceElements(
+          elements,
+          componentInstance.overrides ?? {}
+        );
+        const formattedElements = formatComponentElementsId(reconciledElements, [instanceId]);
         this.collection = legacyWindow.elementor.createBackboneElementsCollection(formattedElements);
         this.collection.models.forEach(setInactiveRecursively);
         settings.component_instance = "<template data-children-placeholder></template>";
@@ -2881,7 +2942,7 @@ function createComponentView(options) {
     }
     _getContextMenuConfig() {
       const isAdministrator = isUserAdministrator();
-      const hasPro = (0, import_utils5.hasProInstalled)();
+      const hasPro = (0, import_utils6.hasProInstalled)();
       const isOutdated = isProOutdatedForComponents();
       const showPromoBadge = !hasPro && !isOutdated;
       const badgeClass = "elementor-context-menu-list__item__shortcut__promotion-badge";
@@ -2975,7 +3036,7 @@ function createComponentView(options) {
         notifyComponentEditUpdate();
         return;
       }
-      if (!(0, import_utils5.hasProInstalled)()) {
+      if (!(0, import_utils6.hasProInstalled)()) {
         notifyComponentEditUpgrade();
         return;
       }
@@ -3072,7 +3133,7 @@ function PopulateStore() {
 }
 
 // src/prevent-circular-nesting.ts
-var import_editor_elements9 = require("@elementor/editor-elements");
+var import_editor_elements10 = require("@elementor/editor-elements");
 var import_editor_notifications3 = require("@elementor/editor-notifications");
 var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
 var import_store26 = require("@elementor/store");
@@ -3167,7 +3228,7 @@ function blockCircularMove(args) {
     if (!container) {
       return false;
     }
-    const allElements = (0, import_editor_elements9.getAllDescendants)(container);
+    const allElements = (0, import_editor_elements10.getAllDescendants)(container);
     return allElements.some((element) => {
       const componentId = extractComponentIdFromContainer(element);
       if (componentId === null) {