@elementor/editor-canvas 4.2.0-858 → 4.2.0-860

package/dist/index.js

@@ -121,6 +121,9 @@ function isWidgetAvailableForLLM(config) {
   if (config.meta?.llm_support === false) {
     return false;
   }
+  if (config.title === "Component") {
+    return false;
+  }
   if (config.atomic_props_schema) {
     return true;
   }
@@ -4087,6 +4090,7 @@ var CompositionBuilder = class _CompositionBuilder {
   rootContainers = [];
   api = {
     createElement: import_editor_elements13.createElement,
+    deleteElement: import_editor_elements13.deleteElement,
     getWidgetsCache: import_editor_elements13.getWidgetsCache,
     generateElementId: import_editor_elements13.generateElementId,
     getContainer: import_editor_elements13.getContainer,
@@ -4137,7 +4141,8 @@ var CompositionBuilder = class _CompositionBuilder {
       elements: children,
       editor_settings: {
         title: node.getAttribute("configuration-id") ?? void 0
-      }
+      },
+      elType: "widget"
     };
     if (isWidget) {
       return { ...base, elType: "widget", widgetType: elementTag };
@@ -4169,12 +4174,6 @@ var CompositionBuilder = class _CompositionBuilder {
     }
     return errors;
   }
-  findSchemaForNode(node) {
-    const widgetsCache = this.api.getWidgetsCache() || {};
-    const widgetType = node.tagName;
-    const widgetData = widgetsCache[widgetType]?.atomic_props_schema;
-    return widgetData || null;
-  }
   matchNodeByConfigId(configId) {
     const node = this.xml.querySelector(`[configuration-id="${configId}"]`);
     if (!node) {
@@ -4296,13 +4295,21 @@ ${childTypeErrors.join("\n")}`);
     const children = Array.from(this.xml.children);
     for (const childNode of children) {
       const modelTree = this.buildModelTree(childNode, widgetsCache);
-      const newElement = this.api.createElement({
-        container: rootContainer,
-        model: modelTree,
-        options: { useHistory: false }
-      });
-      this.rootContainers.push(newElement);
-      await this.awaitViewRender(newElement);
+      try {
+        const newElement = this.api.createElement({
+          container: rootContainer,
+          model: modelTree,
+          options: { useHistory: false }
+        });
+        this.rootContainers.push(newElement);
+        await this.awaitViewRender(newElement);
+      } catch (e) {
+        const attempToRestoreInvalidContainer = this.api.getContainer(modelTree.id);
+        if (attempToRestoreInvalidContainer) {
+          this.api.deleteElement({ container: attempToRestoreInvalidContainer });
+        }
+        throw e;
+      }
     }
     const { configErrors, styleErrors, invalidStyles } = await this.applyProperties();
     return {
@@ -4547,6 +4554,7 @@ var initBuildCompositionsTool = (reg) => {
       try {
         const compositionBuilder = CompositionBuilder.fromXMLString(xmlStructure, {
           createElement: import_editor_elements14.createElement,
+          deleteElement: import_editor_elements14.deleteElement,
           getWidgetsCache: import_editor_elements14.getWidgetsCache
         });
         compositionBuilder.setElementConfig(elementConfig);

package/dist/index.mjs

@@ -64,6 +64,9 @@ function isWidgetAvailableForLLM(config) {
   if (config.meta?.llm_support === false) {
     return false;
   }
+  if (config.title === "Component") {
+    return false;
+  }
   if (config.atomic_props_schema) {
     return true;
   }
@@ -3853,7 +3856,7 @@ function getElementDisplayName(container) {
 import { getCurrentDocument } from "@elementor/editor-documents";
 import {
   createElement as createElement8,
-  deleteElement,
+  deleteElement as deleteElement2,
   getContainer as getContainer5,
   getWidgetsCache as getWidgetsCache9
 } from "@elementor/editor-elements";
@@ -3861,6 +3864,7 @@ import {
 // src/composition-builder/composition-builder.ts
 import {
   createElement as createElement7,
+  deleteElement,
   generateElementId as generateElementId2,
   getContainer as getContainer4,
   getWidgetsCache as getWidgetsCache8
@@ -4081,6 +4085,7 @@ var CompositionBuilder = class _CompositionBuilder {
   rootContainers = [];
   api = {
     createElement: createElement7,
+    deleteElement,
     getWidgetsCache: getWidgetsCache8,
     generateElementId: generateElementId2,
     getContainer: getContainer4,
@@ -4131,7 +4136,8 @@ var CompositionBuilder = class _CompositionBuilder {
       elements: children,
       editor_settings: {
         title: node.getAttribute("configuration-id") ?? void 0
-      }
+      },
+      elType: "widget"
     };
     if (isWidget) {
       return { ...base, elType: "widget", widgetType: elementTag };
@@ -4163,12 +4169,6 @@ var CompositionBuilder = class _CompositionBuilder {
     }
     return errors;
   }
-  findSchemaForNode(node) {
-    const widgetsCache = this.api.getWidgetsCache() || {};
-    const widgetType = node.tagName;
-    const widgetData = widgetsCache[widgetType]?.atomic_props_schema;
-    return widgetData || null;
-  }
   matchNodeByConfigId(configId) {
     const node = this.xml.querySelector(`[configuration-id="${configId}"]`);
     if (!node) {
@@ -4290,13 +4290,21 @@ ${childTypeErrors.join("\n")}`);
     const children = Array.from(this.xml.children);
     for (const childNode of children) {
       const modelTree = this.buildModelTree(childNode, widgetsCache);
-      const newElement = this.api.createElement({
-        container: rootContainer,
-        model: modelTree,
-        options: { useHistory: false }
-      });
-      this.rootContainers.push(newElement);
-      await this.awaitViewRender(newElement);
+      try {
+        const newElement = this.api.createElement({
+          container: rootContainer,
+          model: modelTree,
+          options: { useHistory: false }
+        });
+        this.rootContainers.push(newElement);
+        await this.awaitViewRender(newElement);
+      } catch (e) {
+        const attempToRestoreInvalidContainer = this.api.getContainer(modelTree.id);
+        if (attempToRestoreInvalidContainer) {
+          this.api.deleteElement({ container: attempToRestoreInvalidContainer });
+        }
+        throw e;
+      }
     }
     const { configErrors, styleErrors, invalidStyles } = await this.applyProperties();
     return {
@@ -4541,6 +4549,7 @@ var initBuildCompositionsTool = (reg) => {
       try {
         const compositionBuilder = CompositionBuilder.fromXMLString(xmlStructure, {
           createElement: createElement8,
+          deleteElement: deleteElement2,
           getWidgetsCache: getWidgetsCache9
         });
         compositionBuilder.setElementConfig(elementConfig);
@@ -4569,7 +4578,7 @@ var initBuildCompositionsTool = (reg) => {
       }
       if (errors.length) {
         rootContainers.forEach((rootContainer) => {
-          deleteElement({
+          deleteElement2({
             container: rootContainer,
             options: { useHistory: false }
           });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elementor/editor-canvas",
   "description": "Elementor Editor Canvas",
-  "version": "4.2.0-858",
+  "version": "4.2.0-860",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -37,25 +37,25 @@
     "react-dom": "^18.3.1"
   },
   "dependencies": {
-    "@elementor/editor": "4.2.0-858",
+    "@elementor/editor": "4.2.0-860",
     "dompurify": "^3.2.6",
-    "@elementor/editor-controls": "4.2.0-858",
-    "@elementor/editor-documents": "4.2.0-858",
-    "@elementor/editor-elements": "4.2.0-858",
-    "@elementor/editor-interactions": "4.2.0-858",
-    "@elementor/editor-mcp": "4.2.0-858",
-    "@elementor/editor-notifications": "4.2.0-858",
-    "@elementor/editor-props": "4.2.0-858",
-    "@elementor/editor-responsive": "4.2.0-858",
-    "@elementor/editor-styles": "4.2.0-858",
-    "@elementor/editor-styles-repository": "4.2.0-858",
-    "@elementor/editor-ui": "4.2.0-858",
-    "@elementor/editor-v1-adapters": "4.2.0-858",
-    "@elementor/schema": "4.2.0-858",
-    "@elementor/twing": "4.2.0-858",
+    "@elementor/editor-controls": "4.2.0-860",
+    "@elementor/editor-documents": "4.2.0-860",
+    "@elementor/editor-elements": "4.2.0-860",
+    "@elementor/editor-interactions": "4.2.0-860",
+    "@elementor/editor-mcp": "4.2.0-860",
+    "@elementor/editor-notifications": "4.2.0-860",
+    "@elementor/editor-props": "4.2.0-860",
+    "@elementor/editor-responsive": "4.2.0-860",
+    "@elementor/editor-styles": "4.2.0-860",
+    "@elementor/editor-styles-repository": "4.2.0-860",
+    "@elementor/editor-ui": "4.2.0-860",
+    "@elementor/editor-v1-adapters": "4.2.0-860",
+    "@elementor/schema": "4.2.0-860",
+    "@elementor/twing": "4.2.0-860",
     "@elementor/ui": "1.37.5",
-    "@elementor/utils": "4.2.0-858",
-    "@elementor/wp-media": "4.2.0-858",
+    "@elementor/utils": "4.2.0-860",
+    "@elementor/wp-media": "4.2.0-860",
     "@floating-ui/react": "^0.27.5",
     "@wordpress/i18n": "^5.13.0"
   },

package/src/composition-builder/composition-builder.ts

@@ -1,11 +1,13 @@
 import {
 	createElement,
 	type CreateElementParams,
+	deleteElement,
 	generateElementId,
 	getContainer,
 	getWidgetsCache,
 	type V1Element,
 	type V1ElementConfig,
+	type V1ElementModelProps,
 } from '@elementor/editor-elements';
 import { type z } from '@elementor/schema';
 
@@ -17,6 +19,7 @@ type AnyConfig = Record< string, Record< string, AnyValue > >;
 
 type API = {
 	createElement: typeof createElement;
+	deleteElement: typeof deleteElement;
 	getWidgetsCache: typeof getWidgetsCache;
 	generateElementId: typeof generateElementId;
 	getContainer: typeof getContainer;
@@ -38,6 +41,7 @@ export class CompositionBuilder {
 	private rootContainers: V1Element[] = [];
 	private api: API = {
 		createElement,
+		deleteElement,
 		getWidgetsCache,
 		generateElementId,
 		getContainer,
@@ -94,15 +98,26 @@ export class CompositionBuilder {
 
 		node.setAttribute( 'id', id );
 
-		const base = {
+		const base: V1ElementModelProps = {
 			id,
 			skipDefaultChildren: true,
-			elements: children,
+			elements: children as V1ElementModelProps[ 'elements' ],
 			editor_settings: {
 				title: node.getAttribute( 'configuration-id' ) ?? undefined,
 			},
+			elType: 'widget',
 		};
 
+		// TODO: Restore this code once components are working in compositions
+		// if ( elementTag === 'e-component' ) {
+		// 	// apply component id before applying values
+		// 	const elementConfig = this.elementConfig[ String( node.getAttribute( 'configuration-id' ) ) ];
+		// 	if ( elementConfig ) {
+		// 		base.settings = base.settings || {};
+		// 		base.settings.component_instance = elementConfig.component_instance;
+		// 	}
+		// }
+
 		if ( isWidget ) {
 			return { ...base, elType: 'widget' as const, widgetType: elementTag };
 		}
@@ -142,13 +157,6 @@ export class CompositionBuilder {
 		return errors;
 	}
 
-	private findSchemaForNode( node: Element ) {
-		const widgetsCache = this.api.getWidgetsCache() || {};
-		const widgetType = node.tagName;
-		const widgetData = widgetsCache[ widgetType ]?.atomic_props_schema;
-		return widgetData || null;
-	}
-
 	private matchNodeByConfigId( configId: string ) {
 		const node = this.xml.querySelector( `[configuration-id="${ configId }"]` );
 		if ( ! node ) {
@@ -282,15 +290,21 @@ export class CompositionBuilder {
 		for ( const childNode of children ) {
 			const modelTree = this.buildModelTree( childNode, widgetsCache );
 
-			const newElement = this.api.createElement( {
-				container: rootContainer,
-				model: modelTree as CreateElementParams[ 'model' ],
-				options: { useHistory: false },
-			} );
-
-			this.rootContainers.push( newElement );
-
-			await this.awaitViewRender( newElement );
+			try {
+				const newElement = this.api.createElement( {
+					container: rootContainer,
+					model: modelTree as CreateElementParams[ 'model' ],
+					options: { useHistory: false },
+				} );
+				this.rootContainers.push( newElement );
+				await this.awaitViewRender( newElement );
+			} catch ( e: unknown ) {
+				const attempToRestoreInvalidContainer = this.api.getContainer( modelTree.id as string );
+				if ( attempToRestoreInvalidContainer ) {
+					this.api.deleteElement( { container: attempToRestoreInvalidContainer } );
+				}
+				throw e;
+			}
 		}
 
 		const { configErrors, styleErrors, invalidStyles } = await this.applyProperties();

package/src/mcp/tools/build-composition/tool.ts

@@ -58,6 +58,7 @@ export const initBuildCompositionsTool = ( reg: MCPRegistryEntry ) => {
 			try {
 				const compositionBuilder = CompositionBuilder.fromXMLString( xmlStructure, {
 					createElement,
+					deleteElement,
 					getWidgetsCache,
 				} );
 				compositionBuilder.setElementConfig( elementConfig );

package/src/mcp/utils/element-data-util.ts

@@ -17,6 +17,10 @@ export function isWidgetAvailableForLLM( config: V1ElementConfig | undefined ):
 	if ( config.meta?.llm_support === false ) {
 		return false;
 	}
+	// TODO: Restore component once working in compositions
+	if ( config.title === 'Component' ) {
+		return false;
+	}
 	if ( config.atomic_props_schema ) {
 		return true;
 	}