@elementor/editor-components 3.35.0-435 → 3.35.0-437

package/dist/index.js

@@ -42,8 +42,8 @@ var import_editor_editing_panel8 = require("@elementor/editor-editing-panel");
 var import_editor_elements_panel = require("@elementor/editor-elements-panel");
 var import_editor_panels4 = require("@elementor/editor-panels");
 var import_editor_styles_repository2 = require("@elementor/editor-styles-repository");
-var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
-var import_store78 = require("@elementor/store");
+var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
+var import_store80 = require("@elementor/store");
 var import_i18n30 = require("@wordpress/i18n");
 
 // src/component-instance-transformer.ts
@@ -2204,7 +2204,7 @@ async function loadComponentsStyles(componentIds) {
   if (!unknownComponentIds.length) {
     return;
   }
-  addComponentStyles(unknownComponentIds);
+  await addComponentStyles(unknownComponentIds);
 }
 async function addComponentStyles(ids) {
   const newComponents = await loadStyles(ids);
@@ -3136,12 +3136,12 @@ function updateCurrentComponent({
   path,
   currentComponentId
 }) {
-  const dispatch19 = (0, import_store49.__getStore)()?.dispatch;
-  if (!dispatch19) {
+  const dispatch20 = (0, import_store49.__getStore)()?.dispatch;
+  if (!dispatch20) {
     return;
   }
-  dispatch19(slice.actions.setPath(path));
-  dispatch19(slice.actions.setCurrentComponentId(currentComponentId));
+  dispatch20(slice.actions.setPath(path));
+  dispatch20(slice.actions.setCurrentComponentId(currentComponentId));
 }
 
 // src/components/edit-component/component-modal.tsx
@@ -4203,18 +4203,72 @@ function isPropAllowed(bind) {
   return !FORBIDDEN_KEYS.includes(bind);
 }
 
-// src/hooks/regenerate-override-keys.ts
+// src/hooks/cleanup-overridable-props-on-delete.ts
 var import_editor_elements17 = require("@elementor/editor-elements");
 var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
+var import_store63 = require("@elementor/store");
+function initCleanupOverridablePropsOnDelete() {
+  (0, import_editor_v1_adapters8.registerDataHook)("after", "document/elements/delete", (args) => {
+    const state = (0, import_store63.__getState)();
+    if (!state) {
+      return;
+    }
+    const currentComponentId = selectCurrentComponentId(state);
+    if (!currentComponentId) {
+      return;
+    }
+    const overridableProps = selectOverridableProps(state, currentComponentId);
+    if (!overridableProps || Object.keys(overridableProps.props).length === 0) {
+      return;
+    }
+    const containers = args.containers ?? (args.container ? [args.container] : []);
+    if (containers.length === 0) {
+      return;
+    }
+    const deletedElementIds = collectDeletedElementIds(containers);
+    if (deletedElementIds.length === 0) {
+      return;
+    }
+    const propKeysToDelete = Object.entries(overridableProps.props).filter(([, prop]) => deletedElementIds.includes(prop.elementId)).map(([propKey]) => propKey);
+    if (propKeysToDelete.length === 0) {
+      return;
+    }
+    const remainingProps = Object.fromEntries(
+      Object.entries(overridableProps.props).filter(([propKey]) => !propKeysToDelete.includes(propKey))
+    );
+    let updatedGroups = overridableProps.groups;
+    for (const propKey of propKeysToDelete) {
+      updatedGroups = removePropFromAllGroups(updatedGroups, propKey);
+    }
+    (0, import_store63.__dispatch)(
+      slice.actions.setOverridableProps({
+        componentId: currentComponentId,
+        overridableProps: {
+          ...overridableProps,
+          props: remainingProps,
+          groups: updatedGroups
+        }
+      })
+    );
+  });
+}
+function collectDeletedElementIds(containers) {
+  const elementIds = containers.filter(Boolean).flatMap((container) => [container, ...(0, import_editor_elements17.getAllDescendants)(container)]).map((element) => element.model?.get?.("id") ?? element.id).filter((id2) => Boolean(id2));
+  return elementIds;
+}
+
+// src/hooks/regenerate-override-keys.ts
+var import_editor_elements18 = require("@elementor/editor-elements");
+var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
 var import_utils8 = require("@elementor/utils");
 function initRegenerateOverrideKeys() {
-  (0, import_editor_v1_adapters8.registerDataHook)("after", "document/elements/duplicate", (_args, result) => {
+  (0, import_editor_v1_adapters9.registerDataHook)("after", "document/elements/duplicate", (_args, result) => {
     regenerateOverrideKeysForContainers(result);
   });
-  (0, import_editor_v1_adapters8.registerDataHook)("after", "document/elements/paste", (_args, result) => {
+  (0, import_editor_v1_adapters9.registerDataHook)("after", "document/elements/paste", (_args, result) => {
     regenerateOverrideKeysForContainers(result);
   });
-  (0, import_editor_v1_adapters8.registerDataHook)("after", "document/elements/import", (_args, result) => {
+  (0, import_editor_v1_adapters9.registerDataHook)("after", "document/elements/import", (_args, result) => {
     regenerateOverrideKeysForContainers(result);
   });
 }
@@ -4225,11 +4279,11 @@ function regenerateOverrideKeysForContainers(result) {
   });
 }
 function regenerateOverrideKeysRecursive(elementId) {
-  const container = (0, import_editor_elements17.getContainer)(elementId);
+  const container = (0, import_editor_elements18.getContainer)(elementId);
   if (!container) {
     return;
   }
-  (0, import_editor_elements17.getAllDescendants)(container).forEach(regenerateOverrideKeys);
+  (0, import_editor_elements18.getAllDescendants)(container).forEach(regenerateOverrideKeys);
 }
 function regenerateOverrideKeys(element) {
   if (!isComponentInstance(element.model.toJSON())) {
@@ -4263,7 +4317,7 @@ function regenerateOverrideKeys(element) {
       }
     }
   };
-  (0, import_editor_elements17.updateElementSettings)({
+  (0, import_editor_elements18.updateElementSettings)({
     id: element.id,
     props: { component_instance: newComponentInstance },
     withHistory: false
@@ -4287,7 +4341,7 @@ var import_editor_mcp3 = require("@elementor/editor-mcp");
 
 // src/mcp/save-as-component-tool.ts
 var import_editor_canvas8 = require("@elementor/editor-canvas");
-var import_editor_elements18 = require("@elementor/editor-elements");
+var import_editor_elements19 = require("@elementor/editor-elements");
 var import_editor_mcp2 = require("@elementor/editor-mcp");
 var import_http_client2 = require("@elementor/http-client");
 var import_schema6 = require("@elementor/schema");
@@ -4325,7 +4379,7 @@ var ERROR_MESSAGES3 = {
 var handleSaveAsComponent = async (params) => {
   const { element_id: elementId, component_name: componentName, overridable_props: overridablePropsInput } = params;
   const validElementTypes = getValidElementTypes();
-  const container = (0, import_editor_elements18.getContainer)(elementId);
+  const container = (0, import_editor_elements19.getContainer)(elementId);
   if (!container) {
     throw new Error(ERROR_MESSAGES3.ELEMENT_NOT_FOUND);
   }
@@ -4372,7 +4426,7 @@ function enrichOverridableProps(input, rootElement) {
     }
     const elType = element.elType;
     const widgetType = element.widgetType || element.elType;
-    const elementType = (0, import_editor_elements18.getElementType)(widgetType);
+    const elementType = (0, import_editor_elements19.getElementType)(widgetType);
     if (!elementType) {
       throw new Error(
         `Element type "${widgetType}" is not atomic or does not have a settings schema. Cannot expose property "${propKey}" for element "${elementId}".`
@@ -4441,7 +4495,7 @@ function findElementById(root, targetId) {
   return null;
 }
 function getValidElementTypes() {
-  const types = (0, import_editor_elements18.getWidgetsCache)();
+  const types = (0, import_editor_elements19.getWidgetsCache)();
   if (!types) {
     return [];
   }
@@ -4619,19 +4673,19 @@ function initMcp() {
 
 // src/populate-store.ts
 var import_react18 = require("react");
-var import_store63 = require("@elementor/store");
+var import_store65 = require("@elementor/store");
 function PopulateStore() {
   (0, import_react18.useEffect)(() => {
-    (0, import_store63.__dispatch)(loadComponents());
+    (0, import_store65.__dispatch)(loadComponents());
   }, []);
   return null;
 }
 
 // src/prevent-circular-nesting.ts
-var import_editor_elements19 = require("@elementor/editor-elements");
+var import_editor_elements20 = require("@elementor/editor-elements");
 var import_editor_notifications4 = require("@elementor/editor-notifications");
-var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
-var import_store64 = require("@elementor/store");
+var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
+var import_store66 = require("@elementor/store");
 var import_i18n29 = require("@wordpress/i18n");
 var COMPONENT_TYPE = "e-component";
 var COMPONENT_CIRCULAR_NESTING_ALERT = {
@@ -4640,15 +4694,15 @@ var COMPONENT_CIRCULAR_NESTING_ALERT = {
   id: "circular-component-nesting-blocked"
 };
 function initCircularNestingPrevention() {
-  (0, import_editor_v1_adapters9.blockCommand)({
+  (0, import_editor_v1_adapters10.blockCommand)({
     command: "document/elements/create",
     condition: blockCircularCreate
   });
-  (0, import_editor_v1_adapters9.blockCommand)({
+  (0, import_editor_v1_adapters10.blockCommand)({
     command: "document/elements/move",
     condition: blockCircularMove
   });
-  (0, import_editor_v1_adapters9.blockCommand)({
+  (0, import_editor_v1_adapters10.blockCommand)({
     command: "document/elements/paste",
     condition: blockCircularPaste
   });
@@ -4657,7 +4711,7 @@ function wouldCreateCircularNesting(componentIdToAdd) {
   if (componentIdToAdd === void 0) {
     return false;
   }
-  const state = (0, import_store64.__getState)();
+  const state = (0, import_store66.__getState)();
   const currentComponentId = selectCurrentComponentId(state);
   const path = selectPath(state);
   if (currentComponentId === null) {
@@ -4723,7 +4777,7 @@ function blockCircularMove(args) {
     if (!container) {
       return false;
     }
-    const allElements = (0, import_editor_elements19.getAllDescendants)(container);
+    const allElements = (0, import_editor_elements20.getAllDescendants)(container);
     return allElements.some((element) => {
       const componentId = extractComponentIdFromContainer(element);
       if (componentId === null) {
@@ -4755,19 +4809,19 @@ function blockCircularPaste(args) {
 }
 
 // src/store/actions/remove-component-styles.ts
-var import_store66 = require("@elementor/store");
+var import_store68 = require("@elementor/store");
 function removeComponentStyles(id2) {
   apiClient.invalidateComponentConfigCache(id2);
-  (0, import_store66.__dispatch)(slice.actions.removeStyles({ id: id2 }));
+  (0, import_store68.__dispatch)(slice.actions.removeStyles({ id: id2 }));
 }
 
 // src/store/components-styles-provider.ts
 var import_editor_styles_repository = require("@elementor/editor-styles-repository");
-var import_store68 = require("@elementor/store");
+var import_store70 = require("@elementor/store");
 var componentsStylesProvider = (0, import_editor_styles_repository.createStylesProvider)({
   key: "components-styles",
   priority: 100,
-  subscribe: (cb) => (0, import_store68.__subscribeWithSelector)(
+  subscribe: (cb) => (0, import_store70.__subscribeWithSelector)(
     (state) => state[SLICE_NAME],
     () => {
       cb();
@@ -4775,29 +4829,29 @@ var componentsStylesProvider = (0, import_editor_styles_repository.createStylesP
   ),
   actions: {
     all: () => {
-      return selectFlatStyles((0, import_store68.__getState)());
+      return selectFlatStyles((0, import_store70.__getState)());
     },
     get: (id2) => {
-      return selectFlatStyles((0, import_store68.__getState)()).find((style) => style.id === id2) ?? null;
+      return selectFlatStyles((0, import_store70.__getState)()).find((style) => style.id === id2) ?? null;
     }
   }
 });
 
 // src/sync/create-components-before-save.ts
-var import_editor_elements20 = require("@elementor/editor-elements");
-var import_store70 = require("@elementor/store");
+var import_editor_elements21 = require("@elementor/editor-elements");
+var import_store72 = require("@elementor/store");
 async function createComponentsBeforeSave({
   elements,
   status
 }) {
-  const unpublishedComponents = selectUnpublishedComponents((0, import_store70.__getState)());
+  const unpublishedComponents = selectUnpublishedComponents((0, import_store72.__getState)());
   if (!unpublishedComponents.length) {
     return;
   }
   try {
     const uidToComponentId = await createComponents(unpublishedComponents, status);
     updateComponentInstances(elements, uidToComponentId);
-    (0, import_store70.__dispatch)(
+    (0, import_store72.__dispatch)(
       slice.actions.add(
         unpublishedComponents.map((component) => ({
           id: uidToComponentId.get(component.uid),
@@ -4807,7 +4861,7 @@ async function createComponentsBeforeSave({
         }))
       )
     );
-    (0, import_store70.__dispatch)(slice.actions.resetUnpublished());
+    (0, import_store72.__dispatch)(slice.actions.resetUnpublished());
   } catch (error) {
     throw new Error(`Failed to publish components and update component instances: ${error}`);
   }
@@ -4852,7 +4906,7 @@ function shouldUpdateElement(element, uidToComponentId) {
   return { shouldUpdate: false, newComponentId: null };
 }
 function updateElementComponentId(elementId, componentId) {
-  (0, import_editor_elements20.updateElementSettings)({
+  (0, import_editor_elements21.updateElementSettings)({
     id: elementId,
     props: {
       component_instance: {
@@ -4867,7 +4921,7 @@ function updateElementComponentId(elementId, componentId) {
 }
 
 // src/sync/set-component-overridable-props-settings-before-save.ts
-var import_store72 = require("@elementor/store");
+var import_store74 = require("@elementor/store");
 var setComponentOverridablePropsSettingsBeforeSave = ({
   container
 }) => {
@@ -4875,7 +4929,7 @@ var setComponentOverridablePropsSettingsBeforeSave = ({
   if (!currentDocument || currentDocument.config.type !== COMPONENT_DOCUMENT_TYPE) {
     return;
   }
-  const overridableProps = selectOverridableProps((0, import_store72.__getState)(), currentDocument.id);
+  const overridableProps = selectOverridableProps((0, import_store74.__getState)(), currentDocument.id);
   if (overridableProps) {
     container.settings.set("overridable_props", overridableProps);
   }
@@ -4883,7 +4937,7 @@ var setComponentOverridablePropsSettingsBeforeSave = ({
 
 // src/sync/update-archived-component-before-save.ts
 var import_editor_notifications5 = require("@elementor/editor-notifications");
-var import_store74 = require("@elementor/store");
+var import_store76 = require("@elementor/store");
 var failedNotification = (message) => ({
   type: "error",
   message: `Failed to archive components: ${message}`,
@@ -4891,7 +4945,7 @@ var failedNotification = (message) => ({
 });
 var updateArchivedComponentBeforeSave = async () => {
   try {
-    const archivedComponents = selectArchivedComponents((0, import_store74.__getState)());
+    const archivedComponents = selectArchivedComponents((0, import_store76.__getState)());
     if (!archivedComponents.length) {
       return;
     }
@@ -4908,15 +4962,15 @@ var updateArchivedComponentBeforeSave = async () => {
 };
 
 // src/sync/update-component-title-before-save.ts
-var import_store76 = require("@elementor/store");
+var import_store78 = require("@elementor/store");
 var updateComponentTitleBeforeSave = async () => {
-  const updatedComponentNames = selectUpdatedComponentNames((0, import_store76.__getState)());
+  const updatedComponentNames = selectUpdatedComponentNames((0, import_store78.__getState)());
   if (!updatedComponentNames.length) {
     return;
   }
   const result = await apiClient.updateComponentTitle(updatedComponentNames);
   if (result.failedIds.length === 0) {
-    (0, import_store76.__dispatch)(slice.actions.cleanUpdatedComponentNames());
+    (0, import_store78.__dispatch)(slice.actions.cleanUpdatedComponentNames());
   }
 };
 
@@ -4951,20 +5005,20 @@ var beforeSave = ({ container, status }) => {
 // src/init.ts
 function init() {
   import_editor_styles_repository2.stylesRepository.register(componentsStylesProvider);
-  (0, import_store78.__registerSlice)(slice);
+  (0, import_store80.__registerSlice)(slice);
   (0, import_editor_panels4.__registerPanel)(panel);
   (0, import_editor_canvas9.registerElementType)(
     COMPONENT_WIDGET_TYPE,
     (options) => createComponentType({ ...options, showLockedByModal: openEditModeDialog })
   );
-  (0, import_editor_v1_adapters10.registerDataHook)("dependency", "editor/documents/close", (args) => {
+  (0, import_editor_v1_adapters11.registerDataHook)("dependency", "editor/documents/close", (args) => {
     const document = (0, import_editor_documents13.getV1CurrentDocument)();
     if (document.config.type === COMPONENT_DOCUMENT_TYPE) {
       args.mode = "autosave";
     }
     return true;
   });
-  (0, import_editor_v1_adapters10.registerDataHook)("after", "preview/drop", onElementDrop);
+  (0, import_editor_v1_adapters11.registerDataHook)("after", "preview/drop", onElementDrop);
   window.elementorCommon.__beforeSave = beforeSave;
   (0, import_editor_elements_panel.injectTab)({
     id: "components",
@@ -4988,7 +5042,7 @@ function init() {
     id: "component-panel-header",
     component: ComponentPanelHeader
   });
-  (0, import_editor_v1_adapters10.registerDataHook)("after", "editor/documents/attach-preview", async () => {
+  (0, import_editor_v1_adapters11.registerDataHook)("after", "editor/documents/attach-preview", async () => {
     const { id: id2, config } = (0, import_editor_documents13.getV1CurrentDocument)();
     if (id2) {
       removeComponentStyles(id2);
@@ -5015,6 +5069,7 @@ function init() {
   import_editor_canvas9.settingsTransformersRegistry.register("overridable", componentOverridableTransformer);
   import_editor_canvas9.settingsTransformersRegistry.register("override", componentOverrideTransformer);
   initRegenerateOverrideKeys();
+  initCleanupOverridablePropsOnDelete();
   initMcp();
   initCircularNestingPrevention();
   initNonAtomicNestingPrevention();