@elementor/editor-interactions 4.1.0-764 → 4.1.0-765

package/dist/index.js

@@ -635,41 +635,6 @@ var PopupStateProvider = ({ children }) => {
   return /* @__PURE__ */ React3.createElement(PopupStateContext.Provider, { value: { openByDefault, triggerDefaultOpen, resetDefaultOpen } }, children);
 };
 
-// src/utils/tracking.ts
-var import_editor_elements3 = require("@elementor/editor-elements");
-var import_events = require("@elementor/events");
-var TRIGGER_LABELS2 = {
-  load: "On page load",
-  scrollIn: "Scroll into view",
-  scrollOut: "Scroll out of view",
-  scrollOn: "While scrolling",
-  hover: "Hover",
-  click: "Click"
-};
-var capitalize2 = (s) => s.charAt(0).toUpperCase() + s.slice(1);
-var trackInteractionCreated = (elementId, item) => {
-  const { dispatchEvent, config } = (0, import_events.getMixpanel)();
-  if (!config?.names?.interactions?.created) {
-    return;
-  }
-  const trigger = extractString(item.value.trigger);
-  const effect = extractString(item.value.animation.value.effect);
-  const type = extractString(item.value.animation.value.type);
-  dispatchEvent?.(config.names.interactions.created, {
-    app_type: config?.appTypes?.editor,
-    window_name: config?.appTypes?.editor,
-    interaction_type: config?.triggers?.click,
-    target_name: (0, import_editor_elements3.getElementLabel)(elementId),
-    interaction_result: "interaction_created",
-    target_location: config?.locations?.widgetPanel,
-    location_l1: (0, import_editor_elements3.getElementLabel)(elementId),
-    location_l2: "interactions",
-    interaction_description: "interaction_created",
-    interaction_trigger: TRIGGER_LABELS2[trigger] ?? capitalize2(trigger),
-    interaction_effect: effect === "custom" ? capitalize2(effect) : `${capitalize2(effect)} ${capitalize2(type)}`
-  });
-};
-
 // src/components/interactions-list.tsx
 var React10 = __toESM(require("react"));
 var import_react9 = require("react");
@@ -717,6 +682,41 @@ function syncGridOverlay(trigger, start, end, relativeTo) {
   }
 }
 
+// src/utils/tracking.ts
+var import_editor_elements3 = require("@elementor/editor-elements");
+var import_events = require("@elementor/events");
+var TRIGGER_LABELS2 = {
+  load: "On page load",
+  scrollIn: "Scroll into view",
+  scrollOut: "Scroll out of view",
+  scrollOn: "While scrolling",
+  hover: "Hover",
+  click: "Click"
+};
+var capitalize2 = (s) => s.charAt(0).toUpperCase() + s.slice(1);
+var trackInteractionCreated = (elementId, item) => {
+  const { dispatchEvent, config } = (0, import_events.getMixpanel)();
+  if (!config?.names?.interactions?.created) {
+    return;
+  }
+  const trigger = extractString(item.value.trigger);
+  const effect = extractString(item.value.animation.value.effect);
+  const type = extractString(item.value.animation.value.type);
+  dispatchEvent?.(config.names.interactions.created, {
+    app_type: config?.appTypes?.editor,
+    window_name: config?.appTypes?.editor,
+    interaction_type: config?.triggers?.click,
+    target_name: (0, import_editor_elements3.getElementLabel)(elementId),
+    interaction_result: "interaction_created",
+    target_location: config?.locations?.widgetPanel,
+    location_l1: (0, import_editor_elements3.getElementLabel)(elementId),
+    location_l2: "interactions",
+    interaction_description: "interaction_created",
+    interaction_trigger: TRIGGER_LABELS2[trigger] ?? capitalize2(trigger),
+    interaction_effect: effect === "custom" ? capitalize2(effect) : `${capitalize2(effect)} ${capitalize2(type)}`
+  });
+};
+
 // src/components/interaction-details.tsx
 var React7 = __toESM(require("react"));
 var import_react6 = require("react");
@@ -1145,6 +1145,7 @@ function InteractionsList(props) {
   const { interactions, onSelectInteractions, onPlayInteraction, triggerCreateOnShowEmpty } = props;
   const { elementId } = useInteractionsContext();
   const hasInitializedRef = (0, import_react9.useRef)(false);
+  const newlyCreatedIdsRef = (0, import_react9.useRef)(/* @__PURE__ */ new Set());
   const handleUpdateInteractions = (0, import_react9.useCallback)(
     (newInteractions) => {
       onSelectInteractions(newInteractions);
@@ -1154,9 +1155,11 @@ function InteractionsList(props) {
   (0, import_react9.useEffect)(() => {
     if (triggerCreateOnShowEmpty && !hasInitializedRef.current && (!interactions.items || interactions.items?.length === 0)) {
       hasInitializedRef.current = true;
+      const newItem = createDefaultInteractionItem();
+      newlyCreatedIdsRef.current.add(extractString(newItem.value.interaction_id));
       const newState = {
         version: 1,
-        items: [createDefaultInteractionItem()]
+        items: [newItem]
       };
       handleUpdateInteractions(newState);
     }
@@ -1177,11 +1180,11 @@ function InteractionsList(props) {
       if (meta?.action?.type === "add") {
         const addedItem = meta.action.payload[0]?.item;
         if (addedItem) {
-          trackInteractionCreated(elementId, addedItem);
+          newlyCreatedIdsRef.current.add(extractString(addedItem.value.interaction_id));
         }
       }
     },
-    [interactions, handleUpdateInteractions, elementId]
+    [interactions, handleUpdateInteractions]
   );
   const handleInteractionChange = (0, import_react9.useCallback)(
     (index, newInteractionValue) => {
@@ -1229,7 +1232,14 @@ function InteractionsList(props) {
           );
           syncGridOverlay(trigger, start, end, relativeTo);
         },
-        onPopoverClose: () => dispatchScrollInteraction(null),
+        onPopoverClose: (value) => {
+          dispatchScrollInteraction(null);
+          const id = extractString(value.value.interaction_id);
+          if (newlyCreatedIdsRef.current.has(id)) {
+            newlyCreatedIdsRef.current.delete(id);
+            trackInteractionCreated(elementId, value);
+          }
+        },
         actions: (value) => /* @__PURE__ */ React10.createElement(import_ui6.Tooltip, { key: "preview", placement: "top", title: (0, import_i18n6.__)("Preview", "elementor") }, /* @__PURE__ */ React10.createElement(
           import_ui6.IconButton,
           {
@@ -1257,7 +1267,6 @@ function InteractionsTabContent({ elementId }) {
     {
       onCreateInteraction: () => {
         firstInteractionState[1](true);
-        trackInteractionCreated(elementId, createDefaultInteractionItem());
       }
     }
   ));