@elementor/editor-interactions 4.0.0-604 → 4.0.0-606

package/dist/index.d.mts

@@ -124,4 +124,12 @@ declare const REPLAY_OPTIONS: {
 };
 declare const BASE_REPLAY: string[];
 
-export { BASE_EASINGS, BASE_REPLAY, BASE_TRIGGERS, type CreateInteractionsProviderOptions, EASING_OPTIONS, ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX, EmptyState, type FieldProps, InteractionsTab, REPLAY_OPTIONS, type ReplayFieldProps, TRIGGER_OPTIONS, createInteractionsProvider, getInteractionsConfig, init, interactionsRepository, registerInteractionsControl };
+declare const EFFECT_OPTIONS: {
+    fade: string;
+    slide: string;
+    scale: string;
+    custom: string;
+};
+declare const BASE_EFFECTS: string[];
+
+export { BASE_EASINGS, BASE_EFFECTS, BASE_REPLAY, BASE_TRIGGERS, type CreateInteractionsProviderOptions, EASING_OPTIONS, EFFECT_OPTIONS, ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX, EmptyState, type FieldProps, InteractionsTab, REPLAY_OPTIONS, type ReplayFieldProps, TRIGGER_OPTIONS, createInteractionsProvider, getInteractionsConfig, init, interactionsRepository, registerInteractionsControl };

package/dist/index.d.ts

@@ -124,4 +124,12 @@ declare const REPLAY_OPTIONS: {
 };
 declare const BASE_REPLAY: string[];
 
-export { BASE_EASINGS, BASE_REPLAY, BASE_TRIGGERS, type CreateInteractionsProviderOptions, EASING_OPTIONS, ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX, EmptyState, type FieldProps, InteractionsTab, REPLAY_OPTIONS, type ReplayFieldProps, TRIGGER_OPTIONS, createInteractionsProvider, getInteractionsConfig, init, interactionsRepository, registerInteractionsControl };
+declare const EFFECT_OPTIONS: {
+    fade: string;
+    slide: string;
+    scale: string;
+    custom: string;
+};
+declare const BASE_EFFECTS: string[];
+
+export { BASE_EASINGS, BASE_EFFECTS, BASE_REPLAY, BASE_TRIGGERS, type CreateInteractionsProviderOptions, EASING_OPTIONS, EFFECT_OPTIONS, ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX, EmptyState, type FieldProps, InteractionsTab, REPLAY_OPTIONS, type ReplayFieldProps, TRIGGER_OPTIONS, createInteractionsProvider, getInteractionsConfig, init, interactionsRepository, registerInteractionsControl };

package/dist/index.js

@@ -31,9 +31,11 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var index_exports = {};
 __export(index_exports, {
   BASE_EASINGS: () => BASE_EASINGS,
+  BASE_EFFECTS: () => BASE_EFFECTS,
   BASE_REPLAY: () => BASE_REPLAY,
   BASE_TRIGGERS: () => BASE_TRIGGERS,
   EASING_OPTIONS: () => EASING_OPTIONS,
+  EFFECT_OPTIONS: () => EFFECT_OPTIONS,
   ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX: () => ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX,
   EmptyState: () => EmptyState,
   InteractionsTab: () => InteractionsTab,
@@ -1081,13 +1083,14 @@ function Direction({ value, onChange, interactionType }) {
 
 // src/components/controls/easing.tsx
 var React15 = __toESM(require("react"));
-var import_i18n8 = require("@wordpress/i18n");
+var import_i18n9 = require("@wordpress/i18n");
 
 // src/ui/promotion-select.tsx
 var React14 = __toESM(require("react"));
 var import_react12 = require("react");
 var import_editor_ui2 = require("@elementor/editor-ui");
 var import_ui9 = require("@elementor/ui");
+var import_i18n8 = require("@wordpress/i18n");
 
 // src/ui/interactions-promotion-chip.tsx
 var React13 = __toESM(require("react"));
@@ -1173,7 +1176,7 @@ function PromotionSelect({
           promotionRef.current?.toggle();
         }
       },
-      promotionLabel,
+      promotionLabel ?? (0, import_i18n8.__)("PRO features", "elementor"),
       /* @__PURE__ */ React14.createElement(
         InteractionsPromotionChip,
         {
@@ -1190,13 +1193,13 @@ function PromotionSelect({
 
 // src/components/controls/easing.tsx
 var EASING_OPTIONS = {
-  easeIn: (0, import_i18n8.__)("Ease In", "elementor"),
-  easeInOut: (0, import_i18n8.__)("Ease In Out", "elementor"),
-  easeOut: (0, import_i18n8.__)("Ease Out", "elementor"),
-  backIn: (0, import_i18n8.__)("Back In", "elementor"),
-  backInOut: (0, import_i18n8.__)("Back In Out", "elementor"),
-  backOut: (0, import_i18n8.__)("Back Out", "elementor"),
-  linear: (0, import_i18n8.__)("Linear", "elementor")
+  easeIn: (0, import_i18n9.__)("Ease In", "elementor"),
+  easeInOut: (0, import_i18n9.__)("Ease In Out", "elementor"),
+  easeOut: (0, import_i18n9.__)("Ease Out", "elementor"),
+  backIn: (0, import_i18n9.__)("Back In", "elementor"),
+  backInOut: (0, import_i18n9.__)("Back In Out", "elementor"),
+  backOut: (0, import_i18n9.__)("Back Out", "elementor"),
+  linear: (0, import_i18n9.__)("Linear", "elementor")
 };
 var BASE_EASINGS = ["easeIn"];
 function Easing({}) {
@@ -1212,8 +1215,7 @@ function Easing({}) {
       value: DEFAULT_VALUES.easing,
       baseOptions,
       disabledOptions,
-      promotionLabel: (0, import_i18n8.__)("PRO features", "elementor"),
-      promotionContent: (0, import_i18n8.__)("Upgrade to control the smoothness of the interaction.", "elementor"),
+      promotionContent: (0, import_i18n9.__)("Upgrade to control the smoothness of the interaction.", "elementor"),
       upgradeUrl: "https://go.elementor.com/go-pro-interactions-easing-modal/"
     }
   );
@@ -1221,48 +1223,54 @@ function Easing({}) {
 
 // src/components/controls/effect.tsx
 var React16 = __toESM(require("react"));
-var import_editor_ui3 = require("@elementor/editor-ui");
-var import_ui10 = require("@elementor/ui");
-var import_i18n9 = require("@wordpress/i18n");
+var import_i18n10 = require("@wordpress/i18n");
+var EFFECT_OPTIONS = {
+  fade: (0, import_i18n10.__)("Fade", "elementor"),
+  slide: (0, import_i18n10.__)("Slide", "elementor"),
+  scale: (0, import_i18n10.__)("Scale", "elementor"),
+  custom: (0, import_i18n10.__)("Custom", "elementor")
+};
+var BASE_EFFECTS = ["fade", "slide", "scale"];
 function Effect({ value, onChange }) {
-  const availableEffects = [
-    { key: "fade", label: (0, import_i18n9.__)("Fade", "elementor") },
-    { key: "slide", label: (0, import_i18n9.__)("Slide", "elementor") },
-    { key: "scale", label: (0, import_i18n9.__)("Scale", "elementor") },
-    { key: "custom", label: (0, import_i18n9.__)("Custom", "elementor"), disabled: true }
-  ];
+  const baseOptions = Object.fromEntries(
+    Object.entries(EFFECT_OPTIONS).filter(([key]) => BASE_EFFECTS.includes(key))
+  );
+  const disabledOptions = Object.fromEntries(
+    Object.entries(EFFECT_OPTIONS).filter(([key]) => !BASE_EFFECTS.includes(key))
+  );
   return /* @__PURE__ */ React16.createElement(
-    import_ui10.Select,
+    PromotionSelect,
     {
-      fullWidth: true,
-      displayEmpty: true,
-      size: "tiny",
-      value,
-      onChange: (event) => onChange(event.target.value),
-      MenuProps: { disablePortal: true }
-    },
-    availableEffects.map((effect) => {
-      return /* @__PURE__ */ React16.createElement(import_editor_ui3.MenuListItem, { key: effect.key, value: effect.key, disabled: effect.disabled }, effect.label);
-    })
+      value: value in baseOptions ? value : DEFAULT_VALUES.effect,
+      onChange,
+      baseOptions,
+      disabledOptions,
+      promotionLabel: (0, import_i18n10.__)("PRO effects", "elementor"),
+      promotionContent: (0, import_i18n10.__)(
+        "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/"
+    }
   );
 }
 
 // src/components/controls/effect-type.tsx
 var React17 = __toESM(require("react"));
 var import_editor_controls7 = require("@elementor/editor-controls");
-var import_i18n10 = require("@wordpress/i18n");
+var import_i18n11 = require("@wordpress/i18n");
 function EffectType({ value, onChange }) {
   const options = [
     {
       value: "in",
-      label: (0, import_i18n10.__)("In", "elementor"),
-      renderContent: () => (0, import_i18n10.__)("In", "elementor"),
+      label: (0, import_i18n11.__)("In", "elementor"),
+      renderContent: () => (0, import_i18n11.__)("In", "elementor"),
       showTooltip: true
     },
     {
       value: "out",
-      label: (0, import_i18n10.__)("Out", "elementor"),
-      renderContent: () => (0, import_i18n10.__)("Out", "elementor"),
+      label: (0, import_i18n11.__)("Out", "elementor"),
+      renderContent: () => (0, import_i18n11.__)("Out", "elementor"),
       showTooltip: true
     }
   ];
@@ -1273,11 +1281,11 @@ function EffectType({ value, onChange }) {
 var React18 = __toESM(require("react"));
 var import_editor_controls8 = require("@elementor/editor-controls");
 var import_icons4 = require("@elementor/icons");
-var import_ui11 = require("@elementor/ui");
-var import_i18n11 = require("@wordpress/i18n");
+var import_ui10 = require("@elementor/ui");
+var import_i18n12 = require("@wordpress/i18n");
 var REPLAY_OPTIONS = {
-  no: (0, import_i18n11.__)("No", "elementor"),
-  yes: (0, import_i18n11.__)("Yes", "elementor")
+  no: (0, import_i18n12.__)("No", "elementor"),
+  yes: (0, import_i18n12.__)("Yes", "elementor")
 };
 var BASE_REPLAY = ["no"];
 var OVERLAY_GRID = "1 / 1";
@@ -1299,10 +1307,10 @@ function Replay({ onChange, anchorRef }) {
       showTooltip: true
     }
   ];
-  return /* @__PURE__ */ React18.createElement(import_ui11.Box, { sx: { display: "grid", alignItems: "center" } }, /* @__PURE__ */ React18.createElement(import_ui11.Box, { sx: { gridArea: OVERLAY_GRID } }, /* @__PURE__ */ React18.createElement(import_editor_controls8.ToggleButtonGroupUi, { items: options, exclusive: true, onChange, value: false })), /* @__PURE__ */ React18.createElement(import_ui11.Box, { sx: { gridArea: OVERLAY_GRID, marginInlineEnd: CHIP_OFFSET, justifySelf: "end" } }, /* @__PURE__ */ React18.createElement(
+  return /* @__PURE__ */ React18.createElement(import_ui10.Box, { sx: { display: "grid", alignItems: "center" } }, /* @__PURE__ */ React18.createElement(import_ui10.Box, { sx: { gridArea: OVERLAY_GRID } }, /* @__PURE__ */ React18.createElement(import_editor_controls8.ToggleButtonGroupUi, { items: options, exclusive: true, onChange, value: false })), /* @__PURE__ */ React18.createElement(import_ui10.Box, { sx: { gridArea: OVERLAY_GRID, marginInlineEnd: CHIP_OFFSET, justifySelf: "end" } }, /* @__PURE__ */ React18.createElement(
     InteractionsPromotionChip,
     {
-      content: (0, import_i18n11.__)("Upgrade to run the animation every time its trigger occurs.", "elementor"),
+      content: (0, import_i18n12.__)("Upgrade to run the animation every time its trigger occurs.", "elementor"),
       upgradeUrl: "https://go.elementor.com/go-pro-interactions-replay-modal/",
       anchorRef
     }
@@ -1311,13 +1319,13 @@ function Replay({ onChange, anchorRef }) {
 
 // src/components/controls/trigger.tsx
 var React19 = __toESM(require("react"));
-var import_i18n12 = require("@wordpress/i18n");
+var import_i18n13 = require("@wordpress/i18n");
 var TRIGGER_OPTIONS = {
-  load: (0, import_i18n12.__)("Page load", "elementor"),
-  scrollIn: (0, import_i18n12.__)("Scroll into view", "elementor"),
-  scrollOn: (0, import_i18n12.__)("While scrolling", "elementor"),
-  hover: (0, import_i18n12.__)("On hover", "elementor"),
-  click: (0, import_i18n12.__)("On click", "elementor")
+  load: (0, import_i18n13.__)("Page load", "elementor"),
+  scrollIn: (0, import_i18n13.__)("Scroll into view", "elementor"),
+  scrollOn: (0, import_i18n13.__)("While scrolling", "elementor"),
+  hover: (0, import_i18n13.__)("On hover", "elementor"),
+  click: (0, import_i18n13.__)("On click", "elementor")
 };
 var BASE_TRIGGERS = ["load", "scrollIn"];
 function Trigger({ value, onChange }) {
@@ -1334,8 +1342,8 @@ function Trigger({ value, onChange }) {
       onChange,
       baseOptions,
       disabledOptions,
-      promotionLabel: (0, import_i18n12.__)("PRO triggers", "elementor"),
-      promotionContent: (0, import_i18n12.__)("Upgrade to unlock more interactions triggers.", "elementor"),
+      promotionLabel: (0, import_i18n13.__)("PRO triggers", "elementor"),
+      promotionContent: (0, import_i18n13.__)("Upgrade to unlock more interactions triggers.", "elementor"),
       upgradeUrl: "https://go.elementor.com/go-pro-interactions-triggers-modal/"
     }
   );
@@ -1421,9 +1429,11 @@ function init() {
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   BASE_EASINGS,
+  BASE_EFFECTS,
   BASE_REPLAY,
   BASE_TRIGGERS,
   EASING_OPTIONS,
+  EFFECT_OPTIONS,
   ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX,
   EmptyState,
   InteractionsTab,