@elementor/editor-components 3.35.0-385 → 3.35.0-387

package/dist/index.mjs

@@ -15,7 +15,7 @@ import {
 import { injectTab } from "@elementor/editor-elements-panel";
 import { __registerPanel as registerPanel } from "@elementor/editor-panels";
 import { stylesRepository } from "@elementor/editor-styles-repository";
-import { registerDataHook } from "@elementor/editor-v1-adapters";
+import { registerDataHook as registerDataHook2 } from "@elementor/editor-v1-adapters";
 import { __registerSlice as registerSlice } from "@elementor/store";
 import { __ as __24 } from "@wordpress/i18n";
 
@@ -1677,7 +1677,7 @@ var onElementDrop = (_args, element) => {
 };
 
 // src/create-component-type.ts
-var TYPE = "e-component";
+var COMPONENT_WIDGET_TYPE = "e-component";
 var updateGroups = (groups, config) => {
   const disableMap = new Map(Object.entries(config.disable ?? {}));
   const addMap = new Map(Object.entries(config.add ?? {}));
@@ -1832,11 +1832,16 @@ function setInactiveRecursively(model) {
   }
 }
 
+// src/utils/is-component-instance.ts
+function isComponentInstance(elementModel) {
+  return [elementModel.widgetType, elementModel.elType].includes(COMPONENT_WIDGET_TYPE);
+}
+
 // src/utils/get-component-ids.ts
 var getComponentIds = async (elements) => {
   const components = elements.map(async ({ widgetType, elType, elements: childElements, settings }) => {
     const ids = [];
-    const isComponent = [widgetType, elType].includes(TYPE);
+    const isComponent = isComponentInstance({ widgetType, elType });
     if (isComponent) {
       const componentId = settings?.component_instance?.value?.component_id.value;
       const document = await getComponentDocumentData(componentId);
@@ -3281,16 +3286,99 @@ function isPropAllowed(bind) {
   return !FORBIDDEN_KEYS.includes(bind);
 }
 
+// src/hooks/regenerate-override-keys.ts
+import { getContainer as getContainer3, updateElementSettings as updateElementSettings2 } from "@elementor/editor-elements";
+import { registerDataHook } from "@elementor/editor-v1-adapters";
+import { generateUniqueId as generateUniqueId5 } from "@elementor/utils";
+function initRegenerateOverrideKeys() {
+  registerDataHook("after", "document/elements/duplicate", (_args, result) => {
+    regenerateOverrideKeysForContainers(result);
+  });
+  registerDataHook("after", "document/elements/paste", (_args, result) => {
+    regenerateOverrideKeysForContainers(result);
+  });
+  registerDataHook("after", "document/elements/import", (_args, result) => {
+    regenerateOverrideKeysForContainers(result);
+  });
+}
+function regenerateOverrideKeysForContainers(result) {
+  const containers = Array.isArray(result) ? result : [result];
+  containers.forEach((container) => {
+    regenerateOverrideKeysRecursive(container.id);
+  });
+}
+function regenerateOverrideKeysRecursive(elementId) {
+  const container = getContainer3(elementId);
+  if (!container) {
+    return;
+  }
+  getAllElements(container).forEach(regenerateOverrideKeys);
+}
+function getAllElements(container) {
+  const children = (container.children ?? []).flatMap(getAllElements) ?? [];
+  return [container, ...children];
+}
+function regenerateOverrideKeys(element) {
+  if (!isComponentInstance(element.model.toJSON())) {
+    return;
+  }
+  const settings = element.settings?.toJSON() ?? {};
+  if (!hasOverrides(settings)) {
+    return;
+  }
+  const componentInstance = settings.component_instance;
+  const overrides = componentInstance.value.overrides;
+  const newOverrides = overrides.value.map((override) => {
+    if (!componentInstanceOverridePropTypeUtil.isValid(override)) {
+      return override;
+    }
+    return {
+      ...override,
+      value: {
+        ...override.value,
+        override_key: generateUniqueId5("prop")
+      }
+    };
+  });
+  const newComponentInstance = {
+    ...componentInstance,
+    value: {
+      ...componentInstance.value,
+      overrides: {
+        ...overrides,
+        value: newOverrides
+      }
+    }
+  };
+  updateElementSettings2({
+    id: element.id,
+    props: { component_instance: newComponentInstance },
+    withHistory: false
+  });
+}
+function hasOverrides(settings) {
+  if (!componentInstancePropTypeUtil.isValid(settings?.component_instance)) {
+    return false;
+  }
+  const componentInstance = componentInstancePropTypeUtil.extract(settings?.component_instance);
+  const overrides = componentInstance?.overrides;
+  if (!componentInstanceOverridesPropTypeUtil.isValid(overrides)) {
+    return false;
+  }
+  const overridesValue = overrides?.value;
+  return !!overridesValue?.length;
+}
+
 // src/mcp/index.ts
 import { getMCPByDomain as getMCPByDomain2 } from "@elementor/editor-mcp";
 
 // src/mcp/save-as-component-tool.ts
 import { DOCUMENT_STRUCTURE_URI, WIDGET_SCHEMA_URI } from "@elementor/editor-canvas";
-import { getContainer as getContainer3, getElementType, getWidgetsCache as getWidgetsCache3 } from "@elementor/editor-elements";
+import { getContainer as getContainer4, getElementType, getWidgetsCache as getWidgetsCache3 } from "@elementor/editor-elements";
 import { getMCPByDomain, toolPrompts } from "@elementor/editor-mcp";
 import { AxiosError } from "@elementor/http-client";
 import { z as z6 } from "@elementor/schema";
-import { generateUniqueId as generateUniqueId5 } from "@elementor/utils";
+import { generateUniqueId as generateUniqueId6 } from "@elementor/utils";
 var InputSchema = {
   element_id: z6.string().describe(
     'The unique identifier of the element to save as a component. Use the "list-elements" tool to find available element IDs in the current document.'
@@ -3321,7 +3409,7 @@ var ERROR_MESSAGES2 = {
 var handleSaveAsComponent = async (params) => {
   const { element_id: elementId, component_name: componentName, overridable_props: overridablePropsInput } = params;
   const validElementTypes = getValidElementTypes();
-  const container = getContainer3(elementId);
+  const container = getContainer4(elementId);
   if (!container) {
     throw new Error(ERROR_MESSAGES2.ELEMENT_NOT_FOUND);
   }
@@ -3337,7 +3425,7 @@ var handleSaveAsComponent = async (params) => {
   if (overridableProps) {
     updateElementDataWithOverridableProps(element, overridableProps);
   }
-  const uid = generateUniqueId5("component");
+  const uid = generateUniqueId6("component");
   try {
     await apiClient.validate({
       items: [
@@ -3359,7 +3447,7 @@ var handleSaveAsComponent = async (params) => {
 };
 function enrichOverridableProps(input, rootElement) {
   const enrichedProps = {};
-  const defaultGroupId = generateUniqueId5("group");
+  const defaultGroupId = generateUniqueId6("group");
   Object.entries(input.props).forEach(([, prop]) => {
     const { elementId, propKey } = prop;
     const element = findElementById(rootElement, elementId);
@@ -3380,7 +3468,7 @@ function enrichOverridableProps(input, rootElement) {
         `Property "${propKey}" does not exist in element "${elementId}" (type: ${widgetType}). Available properties: ${availableProps}`
       );
     }
-    const overrideKey = generateUniqueId5("prop");
+    const overrideKey = generateUniqueId6("prop");
     const originValue = element.settings?.[propKey] ? element.settings[propKey] : elementType.propsSchema[propKey].default ?? null;
     const label = generateLabel(propKey);
     enrichedProps[overrideKey] = {
@@ -3438,7 +3526,7 @@ function findElementById(root, targetId) {
   return null;
 }
 function generateLabel(propKey) {
-  const uniqueId = generateUniqueId5("prop");
+  const uniqueId = generateUniqueId6("prop");
   return `${uniqueId} - ${propKey}`;
 }
 function getValidElementTypes() {
@@ -3653,7 +3741,7 @@ var componentsStylesProvider = createStylesProvider({
 });
 
 // src/sync/create-components-before-save.ts
-import { updateElementSettings as updateElementSettings2 } from "@elementor/editor-elements";
+import { updateElementSettings as updateElementSettings3 } from "@elementor/editor-elements";
 import { __dispatch as dispatch15, __getState as getState18 } from "@elementor/store";
 async function createComponentsBeforeSave({
   elements,
@@ -3718,7 +3806,7 @@ function shouldUpdateElement(element, uidToComponentId) {
   return { shouldUpdate: false, newComponentId: null };
 }
 function updateElementComponentId(elementId, componentId) {
-  updateElementSettings2({
+  updateElementSettings3({
     id: elementId,
     props: {
       component_instance: {
@@ -3815,17 +3903,17 @@ function init() {
   registerSlice(slice);
   registerPanel(panel);
   registerElementType(
-    TYPE,
+    COMPONENT_WIDGET_TYPE,
     (options) => createComponentType({ ...options, showLockedByModal: openEditModeDialog })
   );
-  registerDataHook("dependency", "editor/documents/close", (args) => {
+  registerDataHook2("dependency", "editor/documents/close", (args) => {
     const document = getV1CurrentDocument();
     if (document.config.type === COMPONENT_DOCUMENT_TYPE) {
       args.mode = "autosave";
     }
     return true;
   });
-  registerDataHook("after", "preview/drop", onElementDrop);
+  registerDataHook2("after", "preview/drop", onElementDrop);
   window.elementorCommon.__beforeSave = beforeSave;
   injectTab({
     id: "components",
@@ -3848,7 +3936,7 @@ function init() {
     id: "component-panel-header",
     component: ComponentPanelHeader
   });
-  registerDataHook("after", "editor/documents/attach-preview", async () => {
+  registerDataHook2("after", "editor/documents/attach-preview", async () => {
     const { id: id2, config } = getV1CurrentDocument();
     if (id2) {
       removeComponentStyles(id2);
@@ -3873,6 +3961,7 @@ function init() {
   settingsTransformersRegistry2.register("component-instance", componentInstanceTransformer);
   settingsTransformersRegistry2.register("overridable", componentOverridableTransformer);
   settingsTransformersRegistry2.register("override", componentOverrideTransformer);
+  initRegenerateOverrideKeys();
   initMcp();
 }
 export {