@elementor/editor-interactions 4.0.0-650 → 4.0.0-660

package/dist/index.d.mts

@@ -34,6 +34,8 @@ type FieldProps<T = string> = {
     anchorRef?: RefObject<HTMLElement | null>;
 };
 type ReplayFieldProps = FieldProps<boolean>;
+type RepeatFieldProps = FieldProps<string>;
+type TimesFieldProps = FieldProps<number>;
 type DirectionFieldProps = FieldProps<string> & {
     interactionType: string;
 };
@@ -77,7 +79,7 @@ declare const ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX = "document-elements-int
 
 declare function init(): void;
 
-type InteractionsControlType = 'trigger' | 'effect' | 'effectType' | 'direction' | 'duration' | 'delay' | 'replay' | 'easing' | 'relativeTo' | 'start' | 'end' | 'customEffects';
+type InteractionsControlType = 'trigger' | 'effect' | 'effectType' | 'direction' | 'duration' | 'delay' | 'replay' | 'repeat' | 'times' | 'easing' | 'relativeTo' | 'start' | 'end' | 'customEffects';
 type InteractionsControlPropsMap = {
     trigger: FieldProps;
     effect: FieldProps;
@@ -87,6 +89,8 @@ type InteractionsControlPropsMap = {
     duration: FieldProps;
     delay: FieldProps;
     replay: ReplayFieldProps;
+    repeat: RepeatFieldProps;
+    times: TimesFieldProps;
     easing: FieldProps;
     relativeTo: FieldProps;
     start: FieldProps;
@@ -137,10 +141,12 @@ declare const createString: (value: string) => StringPropValue;
 declare const createNumber: (value: number) => NumberPropValue;
 declare const createTimingConfig: (duration: SizeStringValue, delay: SizeStringValue) => TimingConfigPropValue;
 declare const createBoolean: (value: boolean) => BooleanPropValue;
-declare const createConfig: ({ replay, easing, relativeTo, start, end, }: {
+declare const createConfig: ({ replay, easing, relativeTo, repeat, times, start, end, }: {
     replay: boolean;
     easing?: string;
     relativeTo?: string;
+    repeat?: string;
+    times?: number;
     start?: SizeStringValue;
     end?: SizeStringValue;
 }) => ConfigPropValue;
@@ -148,7 +154,7 @@ declare const extractBoolean: (prop: BooleanPropValue | undefined, fallback?: bo
 declare const createExcludedBreakpoints: (breakpoints: string[]) => ExcludedBreakpointsPropValue;
 declare const createInteractionBreakpoints: (excluded: string[]) => InteractionBreakpointsPropValue;
 declare const extractExcludedBreakpoints: (breakpoints: InteractionBreakpointsPropValue | undefined) => string[];
-declare const createAnimationPreset: ({ effect, type, direction, duration, delay, replay, easing, relativeTo, start, end, customEffects, }: {
+declare const createAnimationPreset: ({ effect, type, direction, duration, delay, replay, easing, relativeTo, repeat, times, start, end, customEffects, }: {
     effect: string;
     type: string;
     direction?: string;
@@ -157,11 +163,13 @@ declare const createAnimationPreset: ({ effect, type, direction, duration, delay
     replay: boolean;
     easing?: string;
     relativeTo?: string;
+    repeat?: string;
+    times?: number;
     start?: SizeStringValue;
     end?: SizeStringValue;
     customEffects?: PropValue;
 }) => AnimationPresetPropValue;
-declare const createInteractionItem: ({ trigger, effect, type, direction, duration, delay, interactionId, replay, easing, relativeTo, start, end, excludedBreakpoints, customEffects, }: {
+declare const createInteractionItem: ({ trigger, effect, type, direction, duration, delay, interactionId, replay, easing, relativeTo, repeat, times, start, end, excludedBreakpoints, customEffects, }: {
     trigger?: string;
     effect?: string;
     type?: string;
@@ -172,6 +180,8 @@ declare const createInteractionItem: ({ trigger, effect, type, direction, durati
     replay?: boolean;
     easing?: string;
     relativeTo?: string;
+    repeat?: string;
+    times?: number;
     start?: number;
     end?: number;
     excludedBreakpoints?: string[];

package/dist/index.d.ts

@@ -34,6 +34,8 @@ type FieldProps<T = string> = {
     anchorRef?: RefObject<HTMLElement | null>;
 };
 type ReplayFieldProps = FieldProps<boolean>;
+type RepeatFieldProps = FieldProps<string>;
+type TimesFieldProps = FieldProps<number>;
 type DirectionFieldProps = FieldProps<string> & {
     interactionType: string;
 };
@@ -77,7 +79,7 @@ declare const ELEMENTS_INTERACTIONS_PROVIDER_KEY_PREFIX = "document-elements-int
 
 declare function init(): void;
 
-type InteractionsControlType = 'trigger' | 'effect' | 'effectType' | 'direction' | 'duration' | 'delay' | 'replay' | 'easing' | 'relativeTo' | 'start' | 'end' | 'customEffects';
+type InteractionsControlType = 'trigger' | 'effect' | 'effectType' | 'direction' | 'duration' | 'delay' | 'replay' | 'repeat' | 'times' | 'easing' | 'relativeTo' | 'start' | 'end' | 'customEffects';
 type InteractionsControlPropsMap = {
     trigger: FieldProps;
     effect: FieldProps;
@@ -87,6 +89,8 @@ type InteractionsControlPropsMap = {
     duration: FieldProps;
     delay: FieldProps;
     replay: ReplayFieldProps;
+    repeat: RepeatFieldProps;
+    times: TimesFieldProps;
     easing: FieldProps;
     relativeTo: FieldProps;
     start: FieldProps;
@@ -137,10 +141,12 @@ declare const createString: (value: string) => StringPropValue;
 declare const createNumber: (value: number) => NumberPropValue;
 declare const createTimingConfig: (duration: SizeStringValue, delay: SizeStringValue) => TimingConfigPropValue;
 declare const createBoolean: (value: boolean) => BooleanPropValue;
-declare const createConfig: ({ replay, easing, relativeTo, start, end, }: {
+declare const createConfig: ({ replay, easing, relativeTo, repeat, times, start, end, }: {
     replay: boolean;
     easing?: string;
     relativeTo?: string;
+    repeat?: string;
+    times?: number;
     start?: SizeStringValue;
     end?: SizeStringValue;
 }) => ConfigPropValue;
@@ -148,7 +154,7 @@ declare const extractBoolean: (prop: BooleanPropValue | undefined, fallback?: bo
 declare const createExcludedBreakpoints: (breakpoints: string[]) => ExcludedBreakpointsPropValue;
 declare const createInteractionBreakpoints: (excluded: string[]) => InteractionBreakpointsPropValue;
 declare const extractExcludedBreakpoints: (breakpoints: InteractionBreakpointsPropValue | undefined) => string[];
-declare const createAnimationPreset: ({ effect, type, direction, duration, delay, replay, easing, relativeTo, start, end, customEffects, }: {
+declare const createAnimationPreset: ({ effect, type, direction, duration, delay, replay, easing, relativeTo, repeat, times, start, end, customEffects, }: {
     effect: string;
     type: string;
     direction?: string;
@@ -157,11 +163,13 @@ declare const createAnimationPreset: ({ effect, type, direction, duration, delay
     replay: boolean;
     easing?: string;
     relativeTo?: string;
+    repeat?: string;
+    times?: number;
     start?: SizeStringValue;
     end?: SizeStringValue;
     customEffects?: PropValue;
 }) => AnimationPresetPropValue;
-declare const createInteractionItem: ({ trigger, effect, type, direction, duration, delay, interactionId, replay, easing, relativeTo, start, end, excludedBreakpoints, customEffects, }: {
+declare const createInteractionItem: ({ trigger, effect, type, direction, duration, delay, interactionId, replay, easing, relativeTo, repeat, times, start, end, excludedBreakpoints, customEffects, }: {
     trigger?: string;
     effect?: string;
     type?: string;
@@ -172,6 +180,8 @@ declare const createInteractionItem: ({ trigger, effect, type, direction, durati
     replay?: boolean;
     easing?: string;
     relativeTo?: string;
+    repeat?: string;
+    times?: number;
     start?: number;
     end?: number;
     excludedBreakpoints?: string[];

package/dist/index.js

@@ -280,6 +280,8 @@ var createConfig = ({
   replay,
   easing = "easeIn",
   relativeTo = "",
+  repeat = "",
+  times = 1,
   start = 85,
   end = 15
 }) => ({
@@ -288,6 +290,8 @@ var createConfig = ({
     replay: createBoolean(replay),
     easing: createString(easing),
     relativeTo: createString(relativeTo),
+    repeat: createString(repeat),
+    times: createNumber(times),
     start: createSize(start, "%"),
     end: createSize(end, "%")
   }
@@ -323,6 +327,8 @@ var createAnimationPreset = ({
   replay = false,
   easing = "easeIn",
   relativeTo,
+  repeat,
+  times,
   start,
   end,
   customEffects
@@ -338,6 +344,8 @@ var createAnimationPreset = ({
       replay,
       easing,
       relativeTo,
+      repeat,
+      times,
       start,
       end
     })
@@ -354,6 +362,8 @@ var createInteractionItem = ({
   replay = false,
   easing = "easeIn",
   relativeTo,
+  repeat,
+  times,
   start,
   end,
   excludedBreakpoints,
@@ -372,6 +382,8 @@ var createInteractionItem = ({
       replay,
       easing,
       relativeTo,
+      repeat,
+      times,
       start,
       end,
       customEffects
@@ -544,6 +556,8 @@ var DEFAULT_VALUES = {
   replay: false,
   easing: "easeIn",
   relativeTo: "viewport",
+  repeat: "",
+  times: 1,
   start: 85,
   end: 15
 };
@@ -556,6 +570,8 @@ var controlVisibilityConfig = {
   relativeTo: (values) => values.trigger === "scrollOn",
   start: (values) => values.trigger === "scrollOn",
   end: (values) => values.trigger === "scrollOn",
+  repeat: (values) => values.trigger !== "scrollOn",
+  times: (values) => values.trigger !== "scrollOn" && values.repeat === "times",
   duration: (values) => {
     const isRelativeToVisible = values.trigger === "scrollOn";
     return !isRelativeToVisible;
@@ -565,6 +581,13 @@ var controlVisibilityConfig = {
     return !isRelativeToVisible;
   }
 };
+function normalizeTimesValue(value, fallback) {
+  const numericValue = Number(value);
+  if (!Number.isFinite(numericValue)) {
+    return fallback;
+  }
+  return Math.max(1, Math.floor(numericValue));
+}
 function useControlComponent(controlName, isVisible = true) {
   return (0, import_react5.useMemo)(() => {
     if (!isVisible) {
@@ -584,6 +607,9 @@ var InteractionDetails = ({ interaction, onChange, onPlayInteraction }) => {
   const replay = extractBoolean(interaction.animation.value.config?.value.replay, DEFAULT_VALUES.replay);
   const easing = extractString(interaction.animation.value.config?.value.easing, DEFAULT_VALUES.easing);
   const relativeTo = extractString(interaction.animation.value.config?.value.relativeTo, DEFAULT_VALUES.relativeTo);
+  const configValue = interaction.animation.value.config?.value;
+  const repeat = extractString(configValue?.repeat, DEFAULT_VALUES.repeat);
+  const times = normalizeTimesValue(configValue?.times?.value, DEFAULT_VALUES.times);
   const start = extractSize(interaction.animation.value.config?.value.start, DEFAULT_VALUES.start);
   const end = extractSize(interaction.animation.value.config?.value.end, DEFAULT_VALUES.end);
   const interactionValues = {
@@ -596,6 +622,8 @@ var InteractionDetails = ({ interaction, onChange, onPlayInteraction }) => {
     easing,
     replay,
     relativeTo,
+    repeat,
+    times,
     start,
     end,
     customEffects
@@ -618,6 +646,14 @@ var InteractionDetails = ({ interaction, onChange, onPlayInteraction }) => {
     controlVisibilityConfig.effectType(interactionValues)
   );
   const DirectionControl = useControlComponent("direction", controlVisibilityConfig.direction(interactionValues));
+  const RepeatControl = useControlComponent(
+    "repeat",
+    controlVisibilityConfig.repeat(interactionValues)
+  );
+  const TimesControl = useControlComponent(
+    "times",
+    controlVisibilityConfig.times(interactionValues)
+  );
   const EasingControl = useControlComponent("easing");
   const containerRef = (0, import_react5.useRef)(null);
   const updateInteraction = (updates) => {
@@ -641,6 +677,8 @@ var InteractionDetails = ({ interaction, onChange, onPlayInteraction }) => {
         replay: updates.replay ?? replay,
         easing: updates.easing ?? easing,
         relativeTo: updates.relativeTo ?? relativeTo,
+        repeat: updates.repeat ?? repeat,
+        times: updates.times ?? times,
         start: updates.start ?? start,
         end: updates.end ?? end,
         customEffects: updates.customEffects ?? customEffects
@@ -679,6 +717,14 @@ var InteractionDetails = ({ interaction, onChange, onPlayInteraction }) => {
       onChange: (v) => updateInteraction({ direction: v }),
       interactionType: type
     }
+  )), RepeatControl && /* @__PURE__ */ React7.createElement(Field, { label: (0, import_i18n2.__)("Repeat", "elementor") }, /* @__PURE__ */ React7.createElement(RepeatControl, { value: repeat, onChange: (v) => updateInteraction({ repeat: v }) })), TimesControl && /* @__PURE__ */ React7.createElement(Field, { label: (0, import_i18n2.__)("Times", "elementor") }, /* @__PURE__ */ React7.createElement(
+    TimesControl,
+    {
+      value: times,
+      onChange: (v) => updateInteraction({
+        times: normalizeTimesValue(v, DEFAULT_VALUES.times)
+      })
+    }
   )), controlVisibilityConfig.duration(interactionValues) && /* @__PURE__ */ React7.createElement(Field, { label: (0, import_i18n2.__)("Duration", "elementor") }, /* @__PURE__ */ React7.createElement(
     TimeFrameIndicator,
     {