@elementor/editor-elements 4.4.0-1121 → 4.4.0-1123

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elementor/editor-elements",
   "description": "This package contains the elements model for the Elementor editor",
-  "version": "4.4.0-1121",
+  "version": "4.4.0-1123",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -40,13 +40,13 @@
     "dev": "tsup --config=../../tsup.dev.ts"
   },
   "dependencies": {
-    "@elementor/editor-mcp": "4.4.0-1121",
-    "@elementor/editor-props": "4.4.0-1121",
-    "@elementor/editor-styles": "4.4.0-1121",
-    "@elementor/editor-v1-adapters": "4.4.0-1121",
-    "@elementor/schema": "4.4.0-1121",
-    "@elementor/session": "4.4.0-1121",
-    "@elementor/utils": "4.4.0-1121",
+    "@elementor/editor-mcp": "4.4.0-1123",
+    "@elementor/editor-props": "4.4.0-1123",
+    "@elementor/editor-styles": "4.4.0-1123",
+    "@elementor/editor-v1-adapters": "4.4.0-1123",
+    "@elementor/schema": "4.4.0-1123",
+    "@elementor/session": "4.4.0-1123",
+    "@elementor/utils": "4.4.0-1123",
     "@wordpress/i18n": "^3.1.0"
   },
   "peerDependencies": {

package/src/children-dependencies/bind-settings-reconcile.ts

@@ -82,6 +82,7 @@ function attachChildFromRule( parentId: string, rule: ChildDependencyRule, stash
 	const alreadyPresent = currentChildren.some( ( child ) => child.elType === rule.child_type );
 
 	if ( alreadyPresent ) {
+		placeAnchoredChild( parentId, rule );
 		return;
 	}
 
@@ -123,6 +124,53 @@ function detachChildFromRule( parentId: string, rule: ChildDependencyRule, stash
 	requestNavigatorRefresh( parentId );
 }
 
+function placeAnchoredChild( parentId: string, rule: ChildDependencyRule ): void {
+	if ( rule.position.kind !== 'after_type' && rule.position.kind !== 'before_type' ) {
+		return;
+	}
+
+	let parent: V1Element | undefined;
+
+	try {
+		parent = getContainer( parentId ) ?? undefined;
+	} catch {
+		return;
+	}
+
+	const collection = parent?.model?.get?.( 'elements' ) as
+		| {
+				models?: Array< { get: ( key: string ) => unknown } >;
+				remove?: ( model: unknown, options?: { silent?: boolean } ) => void;
+				add?: ( model: unknown, options?: { at?: number; silent?: boolean } ) => void;
+		  }
+		| undefined;
+	const models = collection?.models;
+
+	if ( ! models || ! collection?.remove || ! collection?.add ) {
+		return;
+	}
+
+	const existingIndex = models.findIndex( ( model ) => model.get( 'elType' ) === rule.child_type );
+
+	if ( existingIndex < 0 ) {
+		return;
+	}
+
+	const siblings = models.map( ( model ) => ( { elType: model.get( 'elType' ) } ) as V1ElementData );
+	const remaining = siblings.filter( ( _, index ) => index !== existingIndex );
+	const insertAt = resolveInsertIndex( rule.position, remaining );
+
+	if ( insertAt === existingIndex ) {
+		return;
+	}
+
+	const model = models[ existingIndex ];
+
+	collection.remove( model, { silent: true } );
+	collection.add( model, { at: insertAt, silent: true } );
+	requestNavigatorRefresh( parentId );
+}
+
 // Backbone `add`/`remove` on the parent elements collection is silent (see
 // assets/dev/js/editor/document/component.js addModelToParent / removeModelFromParent),
 // so the Marionette Navigator CompositeView never observes our mutation. The

package/src/children-dependencies/reconcile-initial-children.ts

@@ -33,6 +33,18 @@ export function reconcileInitialChildren( {
 		const existingIndex = elements.findIndex( ( element ) => element.elType === rule.child_type );
 		const isPresent = existingIndex >= 0;
 
+		if ( isMet && isPresent && isAnchoredPosition( rule.position.kind ) ) {
+			const remaining = elements.filter( ( _, index ) => index !== existingIndex );
+			const insertAt = resolveInsertIndex( rule.position, remaining );
+
+			if ( insertAt !== existingIndex ) {
+				const [ moved ] = elements.splice( existingIndex, 1 );
+				elements.splice( insertAt, 0, moved );
+			}
+
+			return;
+		}
+
 		if ( isMet && ! isPresent ) {
 			const { modelData, wasStashed } = resolveChildModelData( elementId, rule, stash );
 			const insertAt = resolveInsertIndex( rule.position, elements );
@@ -57,3 +69,7 @@ export function reconcileInitialChildren( {
 
 	attributes.elements = elements;
 }
+
+function isAnchoredPosition( kind: string ): boolean {
+	return kind === 'after_type' || kind === 'before_type';
+}