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

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elementor/editor-components",
   "description": "Elementor editor components",
-  "version": "3.35.0-435",
+  "version": "3.35.0-437",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -40,30 +40,30 @@
     "dev": "tsup --config=../../tsup.dev.ts"
   },
   "dependencies": {
-    "@elementor/editor": "3.35.0-435",
-    "@elementor/editor-canvas": "3.35.0-435",
-    "@elementor/editor-controls": "3.35.0-435",
-    "@elementor/editor-documents": "3.35.0-435",
-    "@elementor/editor-editing-panel": "3.35.0-435",
-    "@elementor/editor-elements": "3.35.0-435",
-    "@elementor/editor-elements-panel": "3.35.0-435",
-    "@elementor/editor-mcp": "3.35.0-435",
-    "@elementor/editor-panels": "3.35.0-435",
-    "@elementor/editor-props": "3.35.0-435",
-    "@elementor/editor-styles-repository": "3.35.0-435",
-    "@elementor/editor-ui": "3.35.0-435",
-    "@elementor/editor-v1-adapters": "3.35.0-435",
-    "@elementor/http-client": "3.35.0-435",
+    "@elementor/editor": "3.35.0-437",
+    "@elementor/editor-canvas": "3.35.0-437",
+    "@elementor/editor-controls": "3.35.0-437",
+    "@elementor/editor-documents": "3.35.0-437",
+    "@elementor/editor-editing-panel": "3.35.0-437",
+    "@elementor/editor-elements": "3.35.0-437",
+    "@elementor/editor-elements-panel": "3.35.0-437",
+    "@elementor/editor-mcp": "3.35.0-437",
+    "@elementor/editor-panels": "3.35.0-437",
+    "@elementor/editor-props": "3.35.0-437",
+    "@elementor/editor-styles-repository": "3.35.0-437",
+    "@elementor/editor-ui": "3.35.0-437",
+    "@elementor/editor-v1-adapters": "3.35.0-437",
+    "@elementor/http-client": "3.35.0-437",
     "@elementor/icons": "^1.63.0",
-    "@elementor/mixpanel": "3.35.0-435",
-    "@elementor/query": "3.35.0-435",
-    "@elementor/schema": "3.35.0-435",
-    "@elementor/store": "3.35.0-435",
+    "@elementor/mixpanel": "3.35.0-437",
+    "@elementor/query": "3.35.0-437",
+    "@elementor/schema": "3.35.0-437",
+    "@elementor/store": "3.35.0-437",
     "@elementor/ui": "1.36.17",
-    "@elementor/utils": "3.35.0-435",
+    "@elementor/utils": "3.35.0-437",
     "@wordpress/i18n": "^5.13.0",
-    "@elementor/editor-notifications": "3.35.0-435",
-    "@elementor/editor-current-user": "3.35.0-435"
+    "@elementor/editor-notifications": "3.35.0-437",
+    "@elementor/editor-current-user": "3.35.0-437"
   },
   "peerDependencies": {
     "react": "^18.3.1",

package/src/hooks/cleanup-overridable-props-on-delete.ts

@@ -0,0 +1,83 @@
+import { getAllDescendants, type V1Element } from '@elementor/editor-elements';
+import { registerDataHook } from '@elementor/editor-v1-adapters';
+import { __dispatch as dispatch, __getState as getState } from '@elementor/store';
+
+import { type ComponentsSlice, selectCurrentComponentId, selectOverridableProps, slice } from '../store/store';
+import { removePropFromAllGroups } from '../store/utils/groups-transformers';
+
+type DeleteCommandArgs = {
+	container?: V1Element;
+	containers?: V1Element[];
+};
+
+export function initCleanupOverridablePropsOnDelete() {
+	registerDataHook( 'after', 'document/elements/delete', ( args: DeleteCommandArgs ) => {
+		const state = getState() as ComponentsSlice | undefined;
+
+		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 );
+		}
+
+		dispatch(
+			slice.actions.setOverridableProps( {
+				componentId: currentComponentId,
+				overridableProps: {
+					...overridableProps,
+					props: remainingProps,
+					groups: updatedGroups,
+				},
+			} )
+		);
+	} );
+}
+
+function collectDeletedElementIds( containers: V1Element[] ): string[] {
+	const elementIds = containers
+		.filter( Boolean )
+		.flatMap( ( container ) => [ container, ...getAllDescendants( container ) ] )
+		.map( ( element ) => element.model?.get?.( 'id' ) ?? element.id )
+		.filter( ( id ): id is string => Boolean( id ) );
+
+	return elementIds;
+}

package/src/init.ts

@@ -34,6 +34,7 @@ import { InstanceEditingPanel } from './components/instance-editing-panel/instan
 import { OverridablePropControl } from './components/overridable-props/overridable-prop-control';
 import { OverridablePropIndicator } from './components/overridable-props/overridable-prop-indicator';
 import { COMPONENT_WIDGET_TYPE, createComponentType } from './create-component-type';
+import { initCleanupOverridablePropsOnDelete } from './hooks/cleanup-overridable-props-on-delete';
 import { initRegenerateOverrideKeys } from './hooks/regenerate-override-keys';
 import { initMcp } from './mcp';
 import { PopulateStore } from './populate-store';
@@ -132,6 +133,8 @@ export function init() {
 
 	initRegenerateOverrideKeys();
 
+	initCleanupOverridablePropsOnDelete();
+
 	initMcp();
 
 	initCircularNestingPrevention();

package/src/store/actions/load-components-styles.ts

@@ -18,7 +18,7 @@ export async function loadComponentsStyles( componentIds: number[] ) {
 		return;
 	}
 
-	addComponentStyles( unknownComponentIds );
+	await addComponentStyles( unknownComponentIds );
 }
 
 async function addComponentStyles( ids: ComponentId[] ) {