@elementor/editor-controls 3.35.0-469 → 3.35.0-470

package/dist/index.mjs

@@ -1265,8 +1265,21 @@ var RepeaterContextProvider = ({
     persistWhen: () => true
   });
   const [uniqueKeys, setUniqueKeys] = useState5(() => {
-    return items2?.map((_, index) => index) ?? [];
+    return items2?.map(() => generateUniqueKey()) ?? [];
   });
+  React25.useEffect(() => {
+    const nextLength = items2?.length ?? 0;
+    setUniqueKeys((prev) => {
+      const prevLength = prev.length;
+      if (prevLength === nextLength) {
+        return prev;
+      }
+      if (prevLength > nextLength) {
+        return prev.slice(0, nextLength);
+      }
+      return [...prev, ...Array.from({ length: nextLength - prevLength }, generateUniqueKey)];
+    });
+  }, [items2?.length]);
   const itemsWithKeys = useMemo3(
     () => uniqueKeys.map((key, index) => ({
       key,
@@ -2161,7 +2174,7 @@ function ensureFilterConfig(name) {
 
 // src/controls/select-control-wrapper.tsx
 import * as React50 from "react";
-import { useEffect as useEffect4, useState as useState6 } from "react";
+import { useEffect as useEffect5, useState as useState6 } from "react";
 var getOffCanvasElements = () => {
   const extendedWindow = window;
   const documentId = extendedWindow.elementor.config.document.id;
@@ -2180,7 +2193,7 @@ var collectionMethods = {
 };
 var useDynamicOptions = (collectionId, initialOptions) => {
   const [options, setOptions] = useState6(initialOptions ?? []);
-  useEffect4(() => {
+  useEffect5(() => {
     if (!collectionId || !collectionMethods[collectionId]) {
       setOptions(initialOptions ?? []);
       return;
@@ -2202,7 +2215,7 @@ import { stringPropTypeUtil as stringPropTypeUtil4 } from "@elementor/editor-pro
 
 // src/components/control-toggle-button-group.tsx
 import * as React52 from "react";
-import { useEffect as useEffect5, useMemo as useMemo5, useRef as useRef7, useState as useState7 } from "react";
+import { useEffect as useEffect6, useMemo as useMemo5, useRef as useRef7, useState as useState7 } from "react";
 import { ChevronDownIcon } from "@elementor/icons";
 import {
   ListItemText,
@@ -2433,7 +2446,7 @@ var usePreviewButton = (items2, value) => {
   const [previewButton, setPreviewButton] = useState7(
     items2.find((item) => item.value === value) ?? items2[0]
   );
-  useEffect5(() => {
+  useEffect6(() => {
     const selectedButton = items2.find((item) => item.value === value);
     if (selectedButton) {
       setPreviewButton(selectedButton);
@@ -2859,7 +2872,7 @@ import { __ as __20 } from "@wordpress/i18n";
 
 // src/components/item-selector.tsx
 import * as React58 from "react";
-import { useCallback as useCallback2, useEffect as useEffect6, useState as useState9 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect7, useState as useState9 } from "react";
 import { PopoverBody, PopoverHeader as PopoverHeader2, PopoverMenuList, SearchField } from "@elementor/editor-ui";
 import { Box as Box8, Divider as Divider2, Link, Stack as Stack9, Typography as Typography4 } from "@elementor/ui";
 import { debounce } from "@elementor/utils";
@@ -3008,7 +3021,7 @@ var ItemList = ({
 };
 var useDebounce = (fn, delay) => {
   const [debouncedFn] = useState9(() => debounce(fn, delay));
-  useEffect6(() => () => debouncedFn.cancel(), [debouncedFn]);
+  useEffect7(() => () => debouncedFn.cancel(), [debouncedFn]);
   return debouncedFn;
 };
 
@@ -3109,7 +3122,7 @@ var UrlControl = createControl(
 
 // src/controls/link-control.tsx
 import * as React65 from "react";
-import { useEffect as useEffect7, useMemo as useMemo8, useState as useState11 } from "react";
+import { useEffect as useEffect8, useMemo as useMemo8, useState as useState11 } from "react";
 import { getLinkInLinkRestriction } from "@elementor/editor-elements";
 import { linkPropTypeUtil } from "@elementor/editor-props";
 import { MinusIcon, PlusIcon as PlusIcon2 } from "@elementor/icons";
@@ -3476,7 +3489,7 @@ var LinkControl = createControl((props) => {
     }, 300),
     [elementId, isActive]
   );
-  useEffect7(() => {
+  useEffect8(() => {
     debouncedCheckRestriction();
     const handleInlineLinkChanged = (event) => {
       const customEvent = event;
@@ -3759,7 +3772,7 @@ var Control4 = ({
 
 // src/controls/aspect-ratio-control.tsx
 import * as React69 from "react";
-import { useEffect as useEffect8, useState as useState13 } from "react";
+import { useEffect as useEffect9, useState as useState13 } from "react";
 import { stringPropTypeUtil as stringPropTypeUtil8 } from "@elementor/editor-props";
 import { MenuListItem as MenuListItem4 } from "@elementor/editor-ui";
 import { ArrowsMoveHorizontalIcon, ArrowsMoveVerticalIcon } from "@elementor/icons";
@@ -3786,7 +3799,7 @@ var AspectRatioControl = createControl(({ label }) => {
   const [selectedValue, setSelectedValue] = useState13(
     isCustomSelected ? CUSTOM_RATIO : aspectRatioValue || ""
   );
-  useEffect8(() => {
+  useEffect9(() => {
     const isCustomValue = aspectRatioValue && !RATIO_OPTIONS.some((option) => option.value === aspectRatioValue);
     if (isCustomValue) {
       const [width, height] = aspectRatioValue.split("/");
@@ -5553,7 +5566,7 @@ var TransformBasePopoverTrigger = ({
 
 // src/controls/transition-control/transition-repeater-control.tsx
 import * as React97 from "react";
-import { useEffect as useEffect9, useMemo as useMemo13, useState as useState17 } from "react";
+import { useEffect as useEffect10, useMemo as useMemo13, useState as useState17 } from "react";
 import {
   createArrayPropUtils as createArrayPropUtils2,
   selectionSizePropTypeUtil as selectionSizePropTypeUtil2
@@ -5889,7 +5902,7 @@ var TransitionRepeaterControl = createControl(
       });
       return set;
     }, []);
-    useEffect9(() => {
+    useEffect10(() => {
       if (!value || value.length === 0) {
         return;
       }
@@ -5901,7 +5914,7 @@ var TransitionRepeaterControl = createControl(
         setValue(sanitized);
       }
     }, [allowedTransitionSet]);
-    useEffect9(() => {
+    useEffect10(() => {
       recentlyUsedListGetter().then(setRecentlyUsedList);
     }, [recentlyUsedListGetter]);
     const allPropertiesUsed = useMemo13(() => areAllPropertiesUsed(value), [value]);
@@ -6013,7 +6026,7 @@ import { Box as Box24 } from "@elementor/ui";
 import * as React101 from "react";
 import {
   forwardRef as forwardRef10,
-  useEffect as useEffect12,
+  useEffect as useEffect13,
   useRef as useRef26,
   useState as useState19
 } from "react";
@@ -6070,7 +6083,7 @@ import { __ as __51 } from "@wordpress/i18n";
 
 // src/components/url-popover.tsx
 import * as React99 from "react";
-import { useEffect as useEffect10, useRef as useRef24 } from "react";
+import { useEffect as useEffect11, useRef as useRef24 } from "react";
 import { ExternalLinkIcon } from "@elementor/icons";
 import { bindPopover as bindPopover7, Popover as Popover7, Stack as Stack16, TextField as TextField8, ToggleButton as ToggleButton2, Tooltip as Tooltip9 } from "@elementor/ui";
 import { __ as __50 } from "@wordpress/i18n";
@@ -6084,7 +6097,7 @@ var UrlPopover = ({
   onToggleNewTab
 }) => {
   const inputRef = useRef24(null);
-  useEffect10(() => {
+  useEffect11(() => {
     if (popupState.isOpen) {
       requestAnimationFrame(() => inputRef.current?.focus());
     }
@@ -6329,7 +6342,7 @@ var UNDERLINE_KEYBOARD_SHORTCUT = "u";
 var INLINE_EDITOR_RESET_CLASS = "elementor-inline-editor-reset";
 var useOnUpdate = (callback, dependencies) => {
   const hasMounted = useRef26(false);
-  useEffect12(() => {
+  useEffect13(() => {
     if (hasMounted.current) {
       callback();
     } else {
@@ -6575,7 +6588,7 @@ var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /*
 
 // src/components/repeater/repeater.tsx
 import * as React104 from "react";
-import { useEffect as useEffect13, useState as useState20 } from "react";
+import { useEffect as useEffect14, useState as useState20 } from "react";
 import { CopyIcon as CopyIcon2, EyeIcon as EyeIcon2, EyeOffIcon as EyeOffIcon2, PlusIcon as PlusIcon3, XIcon as XIcon4 } from "@elementor/icons";
 import {
   bindPopover as bindPopover9,
@@ -6763,7 +6776,7 @@ var usePopover = (openOnMount, onOpen) => {
   const [ref, setRef] = useState20(null);
   const popoverState = usePopupState10({ variant: "popover" });
   const popoverProps = bindPopover9(popoverState);
-  useEffect13(() => {
+  useEffect14(() => {
     if (openOnMount && ref) {
       popoverState.open(ref);
       onOpen?.();