@elementor/editor-controls 3.32.0-95 → 3.33.0-97

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elementor/editor-controls",
   "description": "This package contains the controls model and utils for the Elementor editor",
-  "version": "3.32.0-95",
+  "version": "3.33.0-97",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -40,21 +40,21 @@
     "dev": "tsup --config=../../tsup.dev.ts"
   },
   "dependencies": {
-    "@elementor/editor-current-user": "3.32.0-95",
-    "@elementor/editor-elements": "3.32.0-95",
-    "@elementor/editor-props": "3.32.0-95",
-    "@elementor/editor-responsive": "3.32.0-95",
-    "@elementor/editor-ui": "3.32.0-95",
-    "@elementor/editor-v1-adapters": "3.32.0-95",
-    "@elementor/env": "3.32.0-95",
-    "@elementor/http-client": "3.32.0-95",
+    "@elementor/editor-current-user": "3.33.0-97",
+    "@elementor/editor-elements": "3.33.0-97",
+    "@elementor/editor-props": "3.33.0-97",
+    "@elementor/editor-responsive": "3.33.0-97",
+    "@elementor/editor-ui": "3.33.0-97",
+    "@elementor/editor-v1-adapters": "3.33.0-97",
+    "@elementor/env": "3.33.0-97",
+    "@elementor/http-client": "3.33.0-97",
     "@elementor/icons": "^1.51.1",
-    "@elementor/locations": "3.32.0-95",
-    "@elementor/query": "3.32.0-95",
-    "@elementor/session": "3.32.0-95",
+    "@elementor/locations": "3.33.0-97",
+    "@elementor/query": "3.33.0-97",
+    "@elementor/session": "3.33.0-97",
     "@elementor/ui": "1.36.12",
-    "@elementor/utils": "3.32.0-95",
-    "@elementor/wp-media": "3.32.0-95",
+    "@elementor/utils": "3.33.0-97",
+    "@elementor/wp-media": "3.33.0-97",
     "@wordpress/i18n": "^5.13.0",
     "@monaco-editor/react": "^4.7.0"
   },

package/src/components/unstable-repeater/context/repeater-context.tsx

@@ -5,6 +5,7 @@ import { type PopupState, usePopupState } from '@elementor/ui';
 
 import { useBoundProp } from '../../../bound-prop-context/use-bound-prop';
 import { useSyncExternalState } from '../../../hooks/use-sync-external-state';
+import { eventBus } from '../../../services/event-bus';
 import { type Item, type RepeatablePropValue } from '../types';
 
 type SetterFn< T > = ( prevItems: T ) => T;
@@ -46,7 +47,11 @@ export const RepeaterContextProvider = < T extends RepeatablePropValue = Repeata
 	children,
 	initial,
 	propTypeUtil,
-}: React.PropsWithChildren< { initial: T; propTypeUtil: PropTypeUtil< string, T[] >; isSortable?: boolean } > ) => {
+}: React.PropsWithChildren< {
+	initial: T;
+	propTypeUtil: PropTypeUtil< string, T[] >;
+	isSortable?: boolean;
+} > ) => {
 	const { value: repeaterValues, setValue: setRepeaterValues } = useBoundProp( propTypeUtil );
 
 	const [ items, setItems ] = useSyncExternalState( {
@@ -92,10 +97,20 @@ export const RepeaterContextProvider = < T extends RepeatablePropValue = Repeata
 
 		setOpenItemIndex( newIndex );
 		popoverState.open( rowRef ?? ev );
+
+		eventBus.emit( `${ propTypeUtil.key }-item-added`, {
+			itemValue: initial.value,
+		} );
 	};
 
 	const removeItem = ( index: number ) => {
+		const itemToRemove = items[ index ];
+
 		setItems( items.filter( ( _, pos ) => pos !== index ) );
+
+		eventBus.emit( `${ propTypeUtil.key }-item-removed`, {
+			itemValue: itemToRemove?.value,
+		} );
 	};
 
 	const updateItem = ( updatedItem: T, index: number ) => {

package/src/controls/transition-control/trainsition-events.ts

@@ -0,0 +1,28 @@
+import { getSelectedElements } from '@elementor/editor-elements';
+import { sendMixpanelEvent } from '@elementor/utils';
+
+import { eventBus } from '../../services/event-bus';
+import { type initialTransitionValue } from './data';
+
+type TransitionItemValue = typeof initialTransitionValue;
+
+const transitionRepeaterMixpanelEvent = {
+	eventName: 'click_added_transition',
+	location: 'V4 Style Tab',
+	secondaryLocation: 'Transition control',
+	trigger: 'click',
+};
+
+export function subscribeToTransitionEvent() {
+	eventBus.subscribe( 'transition-item-added', ( data ) => {
+		const payload = data as { itemValue?: TransitionItemValue };
+		const value = payload?.itemValue?.selection?.value?.value?.value;
+		const selectedElements = getSelectedElements();
+		const widgetType = selectedElements[ 0 ]?.type ?? null;
+		sendMixpanelEvent( {
+			transition_type: value ?? 'unknown',
+			...transitionRepeaterMixpanelEvent,
+			widget_type: widgetType,
+		} );
+	} );
+}

package/src/controls/transition-control/transition-repeater-control.tsx

@@ -10,6 +10,7 @@ import { createControl } from '../../create-control';
 import { RepeatableControl } from '../repeatable-control';
 import { SelectionSizeControl } from '../selection-size-control';
 import { initialTransitionValue, transitionProperties } from './data';
+import { subscribeToTransitionEvent } from './trainsition-events';
 import { TransitionSelector } from './transition-selector';
 
 const DURATION_CONFIG = {
@@ -70,6 +71,8 @@ const disableAddItemTooltipContent = (
 	</Alert>
 );
 
+subscribeToTransitionEvent();
+
 export const TransitionRepeaterControl = createControl(
 	( {
 		recentlyUsedListGetter,

package/src/services/event-bus.ts

@@ -0,0 +1,38 @@
+class EventBus {
+	private listeners = new Map< string, Set< ( data?: unknown ) => void > >();
+
+	subscribe( eventName: string, callback: ( data?: unknown ) => void ) {
+		if ( ! this.listeners.has( eventName ) ) {
+			this.listeners.set( eventName, new Set() );
+		}
+		const eventListeners = this.listeners.get( eventName );
+		if ( eventListeners ) {
+			eventListeners.add( callback );
+		}
+	}
+
+	unsubscribe( eventName: string, callback: ( data?: unknown ) => void ) {
+		const eventListeners = this.listeners.get( eventName );
+		if ( ! eventListeners ) {
+			return;
+		}
+
+		eventListeners.delete( callback );
+		if ( eventListeners.size === 0 ) {
+			this.listeners.delete( eventName );
+		}
+	}
+
+	emit( eventName: string, data?: unknown ) {
+		const eventListeners = this.listeners.get( eventName );
+		if ( eventListeners ) {
+			eventListeners.forEach( ( callback ) => callback( data ) );
+		}
+	}
+
+	clearAll(): void {
+		this.listeners.clear();
+	}
+}
+
+export const eventBus = new EventBus();