@elementor/editor-interactions 4.0.0-676 → 4.0.0-678

package/dist/index.mjs

@@ -1218,16 +1218,24 @@ import { __ as __9 } from "@wordpress/i18n";
 
 // src/ui/interactions-promotion-chip.tsx
 import * as React13 from "react";
-import { forwardRef, useImperativeHandle, useState as useState5 } from "react";
+import { forwardRef, useCallback as useCallback7, useImperativeHandle, useState as useState5 } from "react";
+import { trackUpgradePromotionClick, trackViewPromotion } from "@elementor/editor-controls";
 import { PromotionChip, PromotionPopover, useCanvasClickHandler } from "@elementor/editor-ui";
 import { Box as Box3 } from "@elementor/ui";
 import { __ as __8 } from "@wordpress/i18n";
 var InteractionsPromotionChip = forwardRef(
-  ({ content, upgradeUrl, anchorRef }, ref) => {
+  ({ content, upgradeUrl, anchorRef, trackingData }, ref) => {
     const [isOpen, setIsOpen] = useState5(false);
     useCanvasClickHandler(isOpen, () => setIsOpen(false));
-    const toggle = () => setIsOpen((prev) => !prev);
-    useImperativeHandle(ref, () => ({ toggle }), []);
+    const toggle = useCallback7(() => {
+      setIsOpen((prev) => {
+        if (!prev) {
+          trackViewPromotion(trackingData);
+        }
+        return !prev;
+      });
+    }, [trackingData]);
+    useImperativeHandle(ref, () => ({ toggle }), [toggle]);
     const handleToggle = (e) => {
       e.stopPropagation();
       toggle();
@@ -1245,7 +1253,8 @@ var InteractionsPromotionChip = forwardRef(
         onClose: (e) => {
           e.stopPropagation();
           setIsOpen(false);
-        }
+        },
+        onCtaClick: () => trackUpgradePromotionClick(trackingData)
       },
       /* @__PURE__ */ React13.createElement(
         Box3,
@@ -1269,7 +1278,8 @@ function PromotionSelect({
   disabledOptions,
   promotionLabel,
   promotionContent,
-  upgradeUrl
+  upgradeUrl,
+  trackingData
 }) {
   const promotionRef = useRef4(null);
   const anchorRef = useRef4(null);
@@ -1307,7 +1317,8 @@ function PromotionSelect({
           content: promotionContent,
           upgradeUrl,
           ref: promotionRef,
-          anchorRef
+          anchorRef,
+          trackingData
         }
       )
     ),
@@ -1316,6 +1327,7 @@ function PromotionSelect({
 }
 
 // src/components/controls/easing.tsx
+var TRACKING_DATA = { target_name: "interactions_easing", location_l2: "interactions" };
 var EASING_OPTIONS = {
   easeIn: __10("Ease In", "elementor"),
   easeInOut: __10("Ease In Out", "elementor"),
@@ -1340,7 +1352,8 @@ function Easing({}) {
       baseOptions,
       disabledOptions,
       promotionContent: __10("Upgrade to control the smoothness of the interaction.", "elementor"),
-      upgradeUrl: "https://go.elementor.com/go-pro-interactions-easing-modal/"
+      upgradeUrl: "https://go.elementor.com/go-pro-interactions-easing-modal/",
+      trackingData: TRACKING_DATA
     }
   );
 }
@@ -1348,6 +1361,7 @@ function Easing({}) {
 // src/components/controls/effect.tsx
 import * as React16 from "react";
 import { __ as __11 } from "@wordpress/i18n";
+var TRACKING_DATA2 = { target_name: "interactions_effect", location_l2: "interactions" };
 var EFFECT_OPTIONS = {
   fade: __11("Fade", "elementor"),
   slide: __11("Slide", "elementor"),
@@ -1374,7 +1388,8 @@ function Effect({ value, onChange }) {
         "Upgrade to further customize your animation with opacity, scale, move, rotate and more.",
         "elementor"
       ),
-      upgradeUrl: "https://go.elementor.com/go-pro-interactions-custom-effect-modal/"
+      upgradeUrl: "https://go.elementor.com/go-pro-interactions-custom-effect-modal/",
+      trackingData: TRACKING_DATA2
     }
   );
 }
@@ -1407,6 +1422,7 @@ import { ToggleButtonGroupUi as ToggleButtonGroupUi3 } from "@elementor/editor-c
 import { CheckIcon, MinusIcon } from "@elementor/icons";
 import { Box as Box4 } from "@elementor/ui";
 import { __ as __13 } from "@wordpress/i18n";
+var TRACKING_DATA3 = { target_name: "interactions_replay", location_l2: "interactions" };
 var REPLAY_OPTIONS = {
   no: __13("No", "elementor"),
   yes: __13("Yes", "elementor")
@@ -1436,7 +1452,8 @@ function Replay({ onChange, anchorRef }) {
     {
       content: __13("Upgrade to run the animation every time its trigger occurs.", "elementor"),
       upgradeUrl: "https://go.elementor.com/go-pro-interactions-replay-modal/",
-      anchorRef
+      anchorRef,
+      trackingData: TRACKING_DATA3
     }
   )));
 }
@@ -1444,6 +1461,7 @@ function Replay({ onChange, anchorRef }) {
 // src/components/controls/trigger.tsx
 import * as React19 from "react";
 import { __ as __14 } from "@wordpress/i18n";
+var TRACKING_DATA4 = { target_name: "interactions_trigger", location_l2: "interactions" };
 var TRIGGER_OPTIONS = {
   load: __14("Page load", "elementor"),
   scrollIn: __14("Scroll into view", "elementor"),
@@ -1468,7 +1486,8 @@ function Trigger({ value, onChange }) {
       disabledOptions,
       promotionLabel: __14("PRO triggers", "elementor"),
       promotionContent: __14("Upgrade to unlock more interactions triggers.", "elementor"),
-      upgradeUrl: "https://go.elementor.com/go-pro-interactions-triggers-modal/"
+      upgradeUrl: "https://go.elementor.com/go-pro-interactions-triggers-modal/",
+      trackingData: TRACKING_DATA4
     }
   );
 }