@elementor/editor-controls 4.2.0-839 → 4.2.0-841

package/dist/index.mjs

@@ -2504,9 +2504,22 @@ var SelectControlWrapper = createControl(
 );
 
 // src/controls/chips-control.tsx
-import * as React51 from "react";
+import * as React52 from "react";
 import { stringArrayPropTypeUtil, stringPropTypeUtil as stringPropTypeUtil6 } from "@elementor/editor-props";
-import { Autocomplete, Chip, TextField as TextField5 } from "@elementor/ui";
+import { Autocomplete, TextField as TextField5 } from "@elementor/ui";
+
+// src/components/chips-list.tsx
+import * as React51 from "react";
+import { Chip } from "@elementor/ui";
+var CHIP_SIZE = "tiny";
+function ChipsList({ getLabel, getTagProps, values }) {
+  return /* @__PURE__ */ React51.createElement(React51.Fragment, null, values.map((option, index) => {
+    const { key, ...tagProps } = getTagProps({ index });
+    return /* @__PURE__ */ React51.createElement(Chip, { key, label: getLabel(option), size: CHIP_SIZE, ...tagProps });
+  }));
+}
+
+// src/controls/chips-control.tsx
 var SIZE6 = "tiny";
 var ChipsControl = createControl(({ options }) => {
   const { value, setValue, disabled } = useBoundProp(stringArrayPropTypeUtil);
@@ -2516,7 +2529,7 @@ var ChipsControl = createControl(({ options }) => {
     const values = newValue.map((option) => stringPropTypeUtil6.create(option.value));
     setValue(values);
   };
-  return /* @__PURE__ */ React51.createElement(ControlActions, null, /* @__PURE__ */ React51.createElement(
+  return /* @__PURE__ */ React52.createElement(ControlActions, null, /* @__PURE__ */ React52.createElement(
     Autocomplete,
     {
       fullWidth: true,
@@ -2528,21 +2541,25 @@ var ChipsControl = createControl(({ options }) => {
       options,
       getOptionLabel: (option) => option.label,
       isOptionEqualToValue: (option, val) => option.value === val.value,
-      renderInput: (params) => /* @__PURE__ */ React51.createElement(TextField5, { ...params }),
-      renderTags: (values, getTagProps) => values.map((option, index) => {
-        const { key, ...chipProps } = getTagProps({ index });
-        return /* @__PURE__ */ React51.createElement(Chip, { key, size: "tiny", label: option.label, ...chipProps });
-      })
+      renderInput: (params) => /* @__PURE__ */ React52.createElement(TextField5, { ...params }),
+      renderTags: (tagValues, getTagProps) => /* @__PURE__ */ React52.createElement(
+        ChipsList,
+        {
+          getLabel: (option) => option.label,
+          getTagProps,
+          values: tagValues
+        }
+      )
     }
   ));
 });
 
 // src/controls/toggle-control.tsx
-import * as React55 from "react";
+import * as React56 from "react";
 import { stringPropTypeUtil as stringPropTypeUtil7 } from "@elementor/editor-props";
 
 // src/components/control-toggle-button-group.tsx
-import * as React53 from "react";
+import * as React54 from "react";
 import { useEffect as useEffect8, useMemo as useMemo6, useRef as useRef8, useState as useState7 } from "react";
 import { ChevronDownIcon } from "@elementor/icons";
 import {
@@ -2557,14 +2574,14 @@ import {
 } from "@elementor/ui";
 
 // src/components/conditional-tooltip.tsx
-import * as React52 from "react";
+import * as React53 from "react";
 import { Tooltip as Tooltip4 } from "@elementor/ui";
 var ConditionalTooltip = ({
   showTooltip,
   children,
   label
 }) => {
-  return showTooltip && label ? /* @__PURE__ */ React52.createElement(Tooltip4, { title: label, disableFocusListener: true, placement: "top" }, children) : children;
+  return showTooltip && label ? /* @__PURE__ */ React53.createElement(Tooltip4, { title: label, disableFocusListener: true, placement: "top" }, children) : children;
 };
 
 // src/components/control-toggle-button-group.tsx
@@ -2595,7 +2612,7 @@ var StyledToggleButton = styled6(ToggleButton, {
 		}
 	`}
 `;
-var ToggleButtonGroupUi = React53.forwardRef(
+var ToggleButtonGroupUi = React54.forwardRef(
   ({
     justify = "end",
     size = "tiny",
@@ -2643,7 +2660,7 @@ var ToggleButtonGroupUi = React53.forwardRef(
       return [];
     };
     const placeholderArray = getPlaceholderArray(placeholder);
-    return /* @__PURE__ */ React53.createElement(
+    return /* @__PURE__ */ React54.createElement(
       StyledToggleButtonGroup,
       {
         ref,
@@ -2668,14 +2685,14 @@ var ToggleButtonGroupUi = React53.forwardRef(
           disabled: optionDisabled = false
         }) => {
           const isPlaceholder = placeholderArray.length > 0 && placeholderArray.includes(buttonValue) && (shouldShowExclusivePlaceholder || shouldShowNonExclusivePlaceholder);
-          return /* @__PURE__ */ React53.createElement(
+          return /* @__PURE__ */ React54.createElement(
             ConditionalTooltip,
             {
               key: buttonValue,
               label,
               showTooltip: showTooltip || false
             },
-            /* @__PURE__ */ React53.createElement(
+            /* @__PURE__ */ React54.createElement(
               StyledToggleButton,
               {
                 value: buttonValue,
@@ -2685,12 +2702,12 @@ var ToggleButtonGroupUi = React53.forwardRef(
                 isPlaceholder,
                 disabled: optionDisabled
               },
-              /* @__PURE__ */ React53.createElement(Content3, { size })
+              /* @__PURE__ */ React54.createElement(Content3, { size })
             )
           );
         }
       ),
-      menuItems.length && exclusive && /* @__PURE__ */ React53.createElement(
+      menuItems.length && exclusive && /* @__PURE__ */ React54.createElement(
         SplitButtonGroup,
         {
           size,
@@ -2704,7 +2721,7 @@ var ToggleButtonGroupUi = React53.forwardRef(
   }
 );
 var ControlToggleButtonGroup = (props) => {
-  return /* @__PURE__ */ React53.createElement(ControlActions, null, /* @__PURE__ */ React53.createElement(ToggleButtonGroupUi, { ...props }));
+  return /* @__PURE__ */ React54.createElement(ControlActions, null, /* @__PURE__ */ React54.createElement(ToggleButtonGroupUi, { ...props }));
 };
 var SplitButtonGroup = ({
   size = "tiny",
@@ -2728,7 +2745,7 @@ var SplitButtonGroup = ({
     const shouldRemove = newValue === value;
     onChange(shouldRemove ? null : newValue);
   };
-  return /* @__PURE__ */ React53.createElement(React53.Fragment, null, /* @__PURE__ */ React53.createElement(
+  return /* @__PURE__ */ React54.createElement(React54.Fragment, null, /* @__PURE__ */ React54.createElement(
     ToggleButton,
     {
       value: previewButton.value,
@@ -2741,7 +2758,7 @@ var SplitButtonGroup = ({
       }
     },
     previewButton.renderContent({ size })
-  ), /* @__PURE__ */ React53.createElement(
+  ), /* @__PURE__ */ React54.createElement(
     ToggleButton,
     {
       size,
@@ -2752,8 +2769,8 @@ var SplitButtonGroup = ({
       ref: menuButtonRef,
       value: "__chevron-icon-button__"
     },
-    /* @__PURE__ */ React53.createElement(ChevronDownIcon, { fontSize: size })
-  ), /* @__PURE__ */ React53.createElement(
+    /* @__PURE__ */ React54.createElement(ChevronDownIcon, { fontSize: size })
+  ), /* @__PURE__ */ React54.createElement(
     Menu2,
     {
       open: isMenuOpen,
@@ -2771,14 +2788,14 @@ var SplitButtonGroup = ({
         mt: 0.5
       }
     },
-    items2.map(({ label, value: buttonValue }) => /* @__PURE__ */ React53.createElement(
+    items2.map(({ label, value: buttonValue }) => /* @__PURE__ */ React54.createElement(
       MenuItem,
       {
         key: buttonValue,
         selected: buttonValue === value,
         onClick: () => onMenuItemClick(buttonValue)
       },
-      /* @__PURE__ */ React53.createElement(ListItemText, null, /* @__PURE__ */ React53.createElement(Typography3, { sx: { fontSize: "14px" } }, label))
+      /* @__PURE__ */ React54.createElement(ListItemText, null, /* @__PURE__ */ React54.createElement(Typography3, { sx: { fontSize: "14px" } }, label))
     ))
   ));
 };
@@ -2796,7 +2813,7 @@ var usePreviewButton = (items2, value) => {
 };
 
 // src/utils/convert-toggle-options-to-atomic.tsx
-import * as React54 from "react";
+import * as React55 from "react";
 import * as Icons from "@elementor/icons";
 var convertToggleOptionsToAtomic = (options) => {
   return options.map((option) => {
@@ -2807,7 +2824,7 @@ var convertToggleOptionsToAtomic = (options) => {
       label: option.label,
       renderContent: ({ size }) => {
         if (IconComponent) {
-          return /* @__PURE__ */ React54.createElement(IconComponent, { fontSize: size });
+          return /* @__PURE__ */ React55.createElement(IconComponent, { fontSize: size });
         }
         return option.label;
       },
@@ -2843,7 +2860,7 @@ var ToggleControl = createControl(
       size,
       placeholder
     };
-    return exclusive ? /* @__PURE__ */ React55.createElement(
+    return exclusive ? /* @__PURE__ */ React56.createElement(
       ControlToggleButtonGroup,
       {
         ...toggleButtonGroupProps,
@@ -2852,7 +2869,7 @@ var ToggleControl = createControl(
         disabled,
         exclusive: true
       }
-    ) : /* @__PURE__ */ React55.createElement(
+    ) : /* @__PURE__ */ React56.createElement(
       ControlToggleButtonGroup,
       {
         ...toggleButtonGroupProps,
@@ -2866,15 +2883,15 @@ var ToggleControl = createControl(
 );
 
 // src/controls/number-control.tsx
-import * as React56 from "react";
+import * as React57 from "react";
 import { numberPropTypeUtil } from "@elementor/editor-props";
 import { InputAdornment as InputAdornment3, Typography as Typography4 } from "@elementor/ui";
 var isEmptyOrNaN = (value) => value === null || value === void 0 || value === "" || Number.isNaN(Number(value));
 var renderSuffix = (propType) => {
   if (propType.meta?.suffix) {
-    return /* @__PURE__ */ React56.createElement(InputAdornment3, { position: "end" }, /* @__PURE__ */ React56.createElement(Typography4, { variant: "caption", color: "text.secondary" }, propType.meta.suffix));
+    return /* @__PURE__ */ React57.createElement(InputAdornment3, { position: "end" }, /* @__PURE__ */ React57.createElement(Typography4, { variant: "caption", color: "text.secondary" }, propType.meta.suffix));
   }
-  return /* @__PURE__ */ React56.createElement(React56.Fragment, null);
+  return /* @__PURE__ */ React57.createElement(React57.Fragment, null);
 };
 var NumberControl = createControl(
   ({
@@ -2904,7 +2921,7 @@ var NumberControl = createControl(
       }
       setValue(updatedValue, void 0, { validation: () => isInputValid });
     };
-    return /* @__PURE__ */ React56.createElement(ControlActions, null, /* @__PURE__ */ React56.createElement(
+    return /* @__PURE__ */ React57.createElement(ControlActions, null, /* @__PURE__ */ React57.createElement(
       NumberInput,
       {
         size: "tiny",
@@ -2917,7 +2934,7 @@ var NumberControl = createControl(
         placeholder: labelPlaceholder ?? (isEmptyOrNaN(placeholder) ? "" : String(placeholder)),
         inputProps: { step, min },
         InputProps: {
-          startAdornment: startIcon ? /* @__PURE__ */ React56.createElement(InputAdornment3, { position: "start", disabled: inputDisabled ?? disabled }, startIcon) : void 0,
+          startAdornment: startIcon ? /* @__PURE__ */ React57.createElement(InputAdornment3, { position: "start", disabled: inputDisabled ?? disabled }, startIcon) : void 0,
           endAdornment: renderSuffix(propType)
         }
       }
@@ -2926,7 +2943,7 @@ var NumberControl = createControl(
 );
 
 // src/controls/equal-unequal-sizes-control.tsx
-import * as React57 from "react";
+import * as React58 from "react";
 import { useId as useId2, useRef as useRef9 } from "react";
 import { bindPopover as bindPopover3, bindToggle, Box as Box7, Grid as Grid8, Popover as Popover3, Stack as Stack7, Tooltip as Tooltip5, usePopupState as usePopupState4 } from "@elementor/ui";
 import { __ as __18 } from "@wordpress/i18n";
@@ -2977,14 +2994,14 @@ function EqualUnequalSizesControl({
     }
     setMasterValue(Object.values(newValue)?.pop() ?? null);
   };
-  return /* @__PURE__ */ React57.createElement(React57.Fragment, null, /* @__PURE__ */ React57.createElement(Grid8, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap", ref: rowRefs[0] }, /* @__PURE__ */ React57.createElement(Grid8, { item: true, xs: 6 }, !isShowingGeneralIndicator ? /* @__PURE__ */ React57.createElement(ControlFormLabel, null, label) : /* @__PURE__ */ React57.createElement(ControlLabel, null, label)), /* @__PURE__ */ React57.createElement(Grid8, { item: true, xs: 6 }, /* @__PURE__ */ React57.createElement(Stack7, { direction: "row", alignItems: "center", gap: 1 }, /* @__PURE__ */ React57.createElement(Box7, { flexGrow: 1 }, /* @__PURE__ */ React57.createElement(
+  return /* @__PURE__ */ React58.createElement(React58.Fragment, null, /* @__PURE__ */ React58.createElement(Grid8, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap", ref: rowRefs[0] }, /* @__PURE__ */ React58.createElement(Grid8, { item: true, xs: 6 }, !isShowingGeneralIndicator ? /* @__PURE__ */ React58.createElement(ControlFormLabel, null, label) : /* @__PURE__ */ React58.createElement(ControlLabel, null, label)), /* @__PURE__ */ React58.createElement(Grid8, { item: true, xs: 6 }, /* @__PURE__ */ React58.createElement(Stack7, { direction: "row", alignItems: "center", gap: 1 }, /* @__PURE__ */ React58.createElement(Box7, { flexGrow: 1 }, /* @__PURE__ */ React58.createElement(
     SizeControl,
     {
       placeholder: isMixed ? __18("Mixed", "elementor") : void 0,
       enablePropTypeUnits: !isMixed || !isMixedPlaceholder,
       anchorRef: rowRefs[0]
     }
-  )), /* @__PURE__ */ React57.createElement(Tooltip5, { title: tooltipLabel, placement: "top" }, /* @__PURE__ */ React57.createElement(
+  )), /* @__PURE__ */ React58.createElement(Tooltip5, { title: tooltipLabel, placement: "top" }, /* @__PURE__ */ React58.createElement(
     StyledToggleButton,
     {
       size: "tiny",
@@ -2996,7 +3013,7 @@ function EqualUnequalSizesControl({
       "aria-label": tooltipLabel
     },
     icon
-  ))))), /* @__PURE__ */ React57.createElement(
+  ))))), /* @__PURE__ */ React58.createElement(
     Popover3,
     {
       disablePortal: true,
@@ -3014,7 +3031,7 @@ function EqualUnequalSizesControl({
         paper: { sx: { mt: 0.5, width: rowRefs[0].current?.getBoundingClientRect().width } }
       }
     },
-    /* @__PURE__ */ React57.createElement(
+    /* @__PURE__ */ React58.createElement(
       PropProvider,
       {
         propType: multiSizePropType,
@@ -3023,17 +3040,17 @@ function EqualUnequalSizesControl({
         setValue: applyMultiSizeValue,
         isDisabled: () => multiSizeDisabled
       },
-      /* @__PURE__ */ React57.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React57.createElement(PopoverGridContainer, { ref: rowRefs[1] }, /* @__PURE__ */ React57.createElement(MultiSizeValueControl, { item: items2[0], rowRef: rowRefs[1] }), /* @__PURE__ */ React57.createElement(MultiSizeValueControl, { item: items2[1], rowRef: rowRefs[1] })), /* @__PURE__ */ React57.createElement(PopoverGridContainer, { ref: rowRefs[2] }, /* @__PURE__ */ React57.createElement(MultiSizeValueControl, { item: items2[2], rowRef: rowRefs[2] }), /* @__PURE__ */ React57.createElement(MultiSizeValueControl, { item: items2[3], rowRef: rowRefs[2] })))
+      /* @__PURE__ */ React58.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React58.createElement(PopoverGridContainer, { ref: rowRefs[1] }, /* @__PURE__ */ React58.createElement(MultiSizeValueControl, { item: items2[0], rowRef: rowRefs[1] }), /* @__PURE__ */ React58.createElement(MultiSizeValueControl, { item: items2[1], rowRef: rowRefs[1] })), /* @__PURE__ */ React58.createElement(PopoverGridContainer, { ref: rowRefs[2] }, /* @__PURE__ */ React58.createElement(MultiSizeValueControl, { item: items2[2], rowRef: rowRefs[2] }), /* @__PURE__ */ React58.createElement(MultiSizeValueControl, { item: items2[3], rowRef: rowRefs[2] })))
     )
   ));
 }
 var MultiSizeValueControl = ({ item, rowRef }) => {
   const { bind, label, icon, ariaLabel } = item;
-  return /* @__PURE__ */ React57.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React57.createElement(Grid8, { item: true, xs: 6 }, /* @__PURE__ */ React57.createElement(Grid8, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React57.createElement(Grid8, { item: true, xs: 12 }, /* @__PURE__ */ React57.createElement(ControlLabel, null, label)), /* @__PURE__ */ React57.createElement(Grid8, { item: true, xs: 12 }, /* @__PURE__ */ React57.createElement(SizeControl, { startIcon: icon, ariaLabel, anchorRef: rowRef })))));
+  return /* @__PURE__ */ React58.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React58.createElement(Grid8, { item: true, xs: 6 }, /* @__PURE__ */ React58.createElement(Grid8, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React58.createElement(Grid8, { item: true, xs: 12 }, /* @__PURE__ */ React58.createElement(ControlLabel, null, label)), /* @__PURE__ */ React58.createElement(Grid8, { item: true, xs: 12 }, /* @__PURE__ */ React58.createElement(SizeControl, { startIcon: icon, ariaLabel, anchorRef: rowRef })))));
 };
 
 // src/controls/linked-dimensions-control.tsx
-import * as React64 from "react";
+import * as React65 from "react";
 import { useLayoutEffect, useRef as useRef12, useState as useState9 } from "react";
 import {
   dimensionsPropTypeUtil,
@@ -3045,18 +3062,18 @@ import { Grid as Grid9, Stack as Stack8, Tooltip as Tooltip6 } from "@elementor/
 import { __ as __20, sprintf as sprintf2 } from "@wordpress/i18n";
 
 // src/controls/size-control/unstable-size-control.tsx
-import * as React63 from "react";
+import * as React64 from "react";
 import { useRef as useRef11 } from "react";
 import { sizePropTypeUtil as sizePropTypeUtil4 } from "@elementor/editor-props";
 
 // src/controls/size-control/size-component.tsx
-import * as React62 from "react";
+import * as React63 from "react";
 import { useEffect as useEffect11 } from "react";
 import { useActiveBreakpoint as useActiveBreakpoint3 } from "@elementor/editor-responsive";
 import { Box as Box8, usePopupState as usePopupState6 } from "@elementor/ui";
 
 // src/controls/size-control/size-field.tsx
-import * as React60 from "react";
+import * as React61 from "react";
 import { MathFunctionIcon as MathFunctionIcon3 } from "@elementor/icons";
 import { InputAdornment as InputAdornment4 } from "@elementor/ui";
 
@@ -3248,7 +3265,7 @@ var hasChanged = (next, current) => {
 };
 
 // src/controls/size-control/ui/size-input.tsx
-import * as React58 from "react";
+import * as React59 from "react";
 import { forwardRef as forwardRef8 } from "react";
 var SizeInput2 = forwardRef8(
   ({
@@ -3265,7 +3282,7 @@ var SizeInput2 = forwardRef8(
     inputProps,
     placeholder
   }, ref) => {
-    return /* @__PURE__ */ React58.createElement(
+    return /* @__PURE__ */ React59.createElement(
       NumberInput,
       {
         id,
@@ -3293,7 +3310,7 @@ var getCursorStyle = (readOnly) => ({
 });
 
 // src/controls/size-control/ui/unit-selector.tsx
-import * as React59 from "react";
+import * as React60 from "react";
 import { useId as useId3 } from "react";
 import { MenuListItem as MenuListItem3 } from "@elementor/editor-ui";
 import { bindMenu as bindMenu2, bindTrigger as bindTrigger3, Button as Button3, Menu as Menu3, styled as styled7, usePopupState as usePopupState5 } from "@elementor/ui";
@@ -3319,7 +3336,7 @@ var UnitSelector = ({
     onSelect(option);
     popupState.close();
   };
-  return /* @__PURE__ */ React59.createElement(React59.Fragment, null, /* @__PURE__ */ React59.createElement(
+  return /* @__PURE__ */ React60.createElement(React60.Fragment, null, /* @__PURE__ */ React60.createElement(
     StyledButton2,
     {
       isHighlighted: isUnitHighlighted,
@@ -3328,7 +3345,7 @@ var UnitSelector = ({
       ...bindTrigger3(popupState)
     },
     optionLabelOverrides[value] ?? value
-  ), /* @__PURE__ */ React59.createElement(Menu3, { MenuListProps: { dense: true }, ...bindMenu2(popupState) }, options.map((option) => /* @__PURE__ */ React59.createElement(
+  ), /* @__PURE__ */ React60.createElement(Menu3, { MenuListProps: { dense: true }, ...bindMenu2(popupState) }, options.map((option) => /* @__PURE__ */ React60.createElement(
     MenuListItem3,
     {
       key: option,
@@ -3359,7 +3376,7 @@ var StyledButton2 = styled7(Button3, {
 
 // src/controls/size-control/size-field.tsx
 var UNIT_DISPLAY_LABELS_OVERRIDES = {
-  custom: /* @__PURE__ */ React60.createElement(MathFunctionIcon3, { fontSize: "tiny" })
+  custom: /* @__PURE__ */ React61.createElement(MathFunctionIcon3, { fontSize: "tiny" })
 };
 var SizeField = ({
   value,
@@ -3394,7 +3411,7 @@ var SizeField = ({
     setSize(newSize, isInputValid);
   };
   const inputType = isExtendedUnit(unit) ? "text" : "number";
-  return /* @__PURE__ */ React60.createElement(
+  return /* @__PURE__ */ React61.createElement(
     SizeInput2,
     {
       disabled,
@@ -3409,8 +3426,8 @@ var SizeField = ({
         ...InputProps,
         autoComplete: "off",
         readOnly: isExtendedUnit(unit),
-        startAdornment: startIcon && /* @__PURE__ */ React60.createElement(InputAdornment4, { position: "start", disabled }, startIcon),
-        endAdornment: /* @__PURE__ */ React60.createElement(InputAdornment4, { position: "end" }, /* @__PURE__ */ React60.createElement(
+        startAdornment: startIcon && /* @__PURE__ */ React61.createElement(InputAdornment4, { position: "start", disabled }, startIcon),
+        endAdornment: /* @__PURE__ */ React61.createElement(InputAdornment4, { position: "end" }, /* @__PURE__ */ React61.createElement(
           UnitSelector,
           {
             options: units2,
@@ -3437,7 +3454,7 @@ var shouldHighlightUnit = (value) => {
 };
 
 // src/controls/size-control/ui/text-field-popover.tsx
-import * as React61 from "react";
+import * as React62 from "react";
 import { useEffect as useEffect10, useRef as useRef10 } from "react";
 import { PopoverHeader as PopoverHeader2 } from "@elementor/editor-ui";
 import { MathFunctionIcon as MathFunctionIcon4 } from "@elementor/icons";
@@ -3464,7 +3481,7 @@ var TextFieldPopover2 = ({ popupState, anchorRef, value, onChange, onClose }) =>
     onClose?.();
     popupState.close();
   };
-  return /* @__PURE__ */ React61.createElement(
+  return /* @__PURE__ */ React62.createElement(
     Popover4,
     {
       disablePortal: true,
@@ -3481,15 +3498,15 @@ var TextFieldPopover2 = ({ popupState, anchorRef, value, onChange, onClose }) =>
       transformOrigin: { vertical: "top", horizontal: "center" },
       onClose: handleClose
     },
-    /* @__PURE__ */ React61.createElement(
+    /* @__PURE__ */ React62.createElement(
       PopoverHeader2,
       {
         title: __19("CSS function", "elementor"),
         onClose: handleClose,
-        icon: /* @__PURE__ */ React61.createElement(MathFunctionIcon4, { fontSize: SIZE7 })
+        icon: /* @__PURE__ */ React62.createElement(MathFunctionIcon4, { fontSize: SIZE7 })
       }
     ),
-    /* @__PURE__ */ React61.createElement(
+    /* @__PURE__ */ React62.createElement(
       TextField6,
       {
         value,
@@ -3508,7 +3525,7 @@ var TextFieldPopover2 = ({ popupState, anchorRef, value, onChange, onClose }) =>
 };
 
 // src/controls/size-control/size-component.tsx
-var SizeComponent = ({ anchorRef, SizeFieldWrapper = React62.Fragment, ...sizeFieldProps }) => {
+var SizeComponent = ({ anchorRef, SizeFieldWrapper = React63.Fragment, ...sizeFieldProps }) => {
   const popupState = usePopupState6({ variant: "popover" });
   const activeBreakpoint = useActiveBreakpoint3();
   const isCustomUnit = sizeFieldProps?.value?.unit === EXTENDED_UNITS.custom;
@@ -3538,7 +3555,7 @@ var SizeComponent = ({ anchorRef, SizeFieldWrapper = React62.Fragment, ...sizeFi
     "aria-controls": popupState.isOpen ? popupState.popupId : void 0,
     "aria-haspopup": true
   };
-  return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(SizeFieldWrapper, null, /* @__PURE__ */ React62.createElement(Box8, null, /* @__PURE__ */ React62.createElement(
+  return /* @__PURE__ */ React63.createElement(React63.Fragment, null, /* @__PURE__ */ React63.createElement(SizeFieldWrapper, null, /* @__PURE__ */ React63.createElement(Box8, null, /* @__PURE__ */ React63.createElement(
     SizeField,
     {
       focused: popupState.isOpen ? true : void 0,
@@ -3552,7 +3569,7 @@ var SizeComponent = ({ anchorRef, SizeFieldWrapper = React62.Fragment, ...sizeFi
       },
       ...sizeFieldProps
     }
-  ))), popupState.isOpen && anchorRef?.current && /* @__PURE__ */ React62.createElement(
+  ))), popupState.isOpen && anchorRef?.current && /* @__PURE__ */ React63.createElement(
     TextFieldPopover2,
     {
       popupState,
@@ -3683,7 +3700,7 @@ var UnstableSizeControl = createControl(
         }
       });
     };
-    return /* @__PURE__ */ React63.createElement(
+    return /* @__PURE__ */ React64.createElement(
       SizeComponent,
       {
         units: units2,
@@ -3787,7 +3804,7 @@ var LinkedDimensionsControl = ({ label, isSiteRtl = false, min }) => {
     }
     return sizePropTypeUtil5.extract(dimensionsPlaceholder?.[bind]);
   };
-  return /* @__PURE__ */ React64.createElement(PropProvider, { ...propProviderProps }, /* @__PURE__ */ React64.createElement(Stack8, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React64.createElement(ControlFormLabel, null, label), /* @__PURE__ */ React64.createElement(Tooltip6, { title: isLinked ? unlinkedLabel : linkedLabel, placement: "top" }, /* @__PURE__ */ React64.createElement(
+  return /* @__PURE__ */ React65.createElement(PropProvider, { ...propProviderProps }, /* @__PURE__ */ React65.createElement(Stack8, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React65.createElement(ControlFormLabel, null, label), /* @__PURE__ */ React65.createElement(Tooltip6, { title: isLinked ? unlinkedLabel : linkedLabel, placement: "top" }, /* @__PURE__ */ React65.createElement(
     StyledToggleButton,
     {
       "aria-label": isLinked ? unlinkedLabel : linkedLabel,
@@ -3799,8 +3816,8 @@ var LinkedDimensionsControl = ({ label, isSiteRtl = false, min }) => {
       disabled,
       isPlaceholder: hasPlaceholders
     },
-    /* @__PURE__ */ React64.createElement(LinkedIcon, { fontSize: "tiny" })
-  ))), getCssDimensionProps(label, isSiteRtl).map((row, index) => /* @__PURE__ */ React64.createElement(Stack8, { direction: "row", gap: 2, flexWrap: "nowrap", key: index, ref: gridRowRefs[index] }, row.map(({ icon, ...props }) => /* @__PURE__ */ React64.createElement(Grid9, { container: true, gap: 0.75, alignItems: "center", key: props.bind }, /* @__PURE__ */ React64.createElement(Grid9, { item: true, xs: 12 }, /* @__PURE__ */ React64.createElement(Label, { ...props })), /* @__PURE__ */ React64.createElement(Grid9, { item: true, xs: 12 }, /* @__PURE__ */ React64.createElement(
+    /* @__PURE__ */ React65.createElement(LinkedIcon, { fontSize: "tiny" })
+  ))), getCssDimensionProps(label, isSiteRtl).map((row, index) => /* @__PURE__ */ React65.createElement(Stack8, { direction: "row", gap: 2, flexWrap: "nowrap", key: index, ref: gridRowRefs[index] }, row.map(({ icon, ...props }) => /* @__PURE__ */ React65.createElement(Grid9, { container: true, gap: 0.75, alignItems: "center", key: props.bind }, /* @__PURE__ */ React65.createElement(Grid9, { item: true, xs: 12 }, /* @__PURE__ */ React65.createElement(Label, { ...props })), /* @__PURE__ */ React65.createElement(Grid9, { item: true, xs: 12 }, /* @__PURE__ */ React65.createElement(
     Control3,
     {
       bind: props.bind,
@@ -3823,7 +3840,7 @@ var Control3 = ({
   min
 }) => {
   if (isLinked) {
-    return /* @__PURE__ */ React64.createElement(
+    return /* @__PURE__ */ React65.createElement(
       UnstableSizeControl,
       {
         ariaLabel,
@@ -3834,7 +3851,7 @@ var Control3 = ({
       }
     );
   }
-  return /* @__PURE__ */ React64.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React64.createElement(
+  return /* @__PURE__ */ React65.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React65.createElement(
     UnstableSizeControl,
     {
       ariaLabel,
@@ -3846,7 +3863,7 @@ var Control3 = ({
   ));
 };
 var Label = ({ label, bind }) => {
-  return /* @__PURE__ */ React64.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React64.createElement(ControlLabel, null, label));
+  return /* @__PURE__ */ React65.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React65.createElement(ControlLabel, null, label));
 };
 var getFirstDefined = (dimensions) => {
   return dimensions?.["block-start"] ?? dimensions?.["inline-end"] ?? dimensions?.["block-end"] ?? dimensions?.["inline-start"];
@@ -3859,7 +3876,7 @@ function getCssDimensionProps(label, isSiteRtl) {
         label: __20("Top", "elementor"),
         /* translators: %s is the name of the main group (margin or padding) */
         ariaLabel: sprintf2(__20("%s top", "elementor"), label),
-        icon: /* @__PURE__ */ React64.createElement(SideTopIcon, { fontSize: "tiny" })
+        icon: /* @__PURE__ */ React65.createElement(SideTopIcon, { fontSize: "tiny" })
       },
       {
         bind: "inline-end",
@@ -3871,7 +3888,7 @@ function getCssDimensionProps(label, isSiteRtl) {
           /* translators: %s is the name of the main group (margin or padding) */
           sprintf2(__20("%s right", "elementor"), label)
         ),
-        icon: isSiteRtl ? /* @__PURE__ */ React64.createElement(SideLeftIcon, { fontSize: "tiny" }) : /* @__PURE__ */ React64.createElement(SideRightIcon, { fontSize: "tiny" })
+        icon: isSiteRtl ? /* @__PURE__ */ React65.createElement(SideLeftIcon, { fontSize: "tiny" }) : /* @__PURE__ */ React65.createElement(SideRightIcon, { fontSize: "tiny" })
       }
     ],
     [
@@ -3880,7 +3897,7 @@ function getCssDimensionProps(label, isSiteRtl) {
         label: __20("Bottom", "elementor"),
         /* translators: %s is the name of the main group (margin or padding) */
         ariaLabel: sprintf2(__20("%s bottom", "elementor"), label),
-        icon: /* @__PURE__ */ React64.createElement(SideBottomIcon, { fontSize: "tiny" })
+        icon: /* @__PURE__ */ React65.createElement(SideBottomIcon, { fontSize: "tiny" })
       },
       {
         bind: "inline-start",
@@ -3892,14 +3909,14 @@ function getCssDimensionProps(label, isSiteRtl) {
           /* translators: %s is the name of the main group (margin or padding) */
           sprintf2(__20("%s left", "elementor"), label)
         ),
-        icon: isSiteRtl ? /* @__PURE__ */ React64.createElement(SideRightIcon, { fontSize: "tiny" }) : /* @__PURE__ */ React64.createElement(SideLeftIcon, { fontSize: "tiny" })
+        icon: isSiteRtl ? /* @__PURE__ */ React65.createElement(SideRightIcon, { fontSize: "tiny" }) : /* @__PURE__ */ React65.createElement(SideLeftIcon, { fontSize: "tiny" })
       }
     ]
   ];
 }
 
 // src/controls/font-family-control/font-family-control.tsx
-import * as React66 from "react";
+import * as React67 from "react";
 import { useMemo as useMemo8 } from "react";
 import { stringPropTypeUtil as stringPropTypeUtil8 } from "@elementor/editor-props";
 import { ChevronDownIcon as ChevronDownIcon2, TextIcon } from "@elementor/icons";
@@ -3907,7 +3924,7 @@ import { bindPopover as bindPopover5, bindTrigger as bindTrigger4, Popover as Po
 import { __ as __22 } from "@wordpress/i18n";
 
 // src/components/item-selector.tsx
-import * as React65 from "react";
+import * as React66 from "react";
 import { useCallback as useCallback3, useEffect as useEffect12, useState as useState10 } from "react";
 import { PopoverBody, PopoverHeader as PopoverHeader3, PopoverMenuList, SearchField } from "@elementor/editor-ui";
 import { Box as Box9, Divider as Divider2, Link, Stack as Stack9, Typography as Typography5 } from "@elementor/ui";
@@ -3957,7 +3974,7 @@ var ItemSelector = ({
     setSearchValue("");
     onClose();
   };
-  return /* @__PURE__ */ React65.createElement(PopoverBody, { width: sectionWidth, id }, /* @__PURE__ */ React65.createElement(PopoverHeader3, { title, onClose: handleClose, icon: /* @__PURE__ */ React65.createElement(IconComponent, { fontSize: "tiny" }) }), /* @__PURE__ */ React65.createElement(
+  return /* @__PURE__ */ React66.createElement(PopoverBody, { width: sectionWidth, id }, /* @__PURE__ */ React66.createElement(PopoverHeader3, { title, onClose: handleClose, icon: /* @__PURE__ */ React66.createElement(IconComponent, { fontSize: "tiny" }) }), /* @__PURE__ */ React66.createElement(
     SearchField,
     {
       value: searchValue,
@@ -3965,7 +3982,7 @@ var ItemSelector = ({
       placeholder: __21("Search", "elementor"),
       id: id + "-search"
     }
-  ), /* @__PURE__ */ React65.createElement(Divider2, null), /* @__PURE__ */ React65.createElement(Box9, { sx: { flex: 1, overflow: "auto", minHeight: 0 } }, filteredItemsList.length > 0 ? /* @__PURE__ */ React65.createElement(
+  ), /* @__PURE__ */ React66.createElement(Divider2, null), /* @__PURE__ */ React66.createElement(Box9, { sx: { flex: 1, overflow: "auto", minHeight: 0 } }, filteredItemsList.length > 0 ? /* @__PURE__ */ React66.createElement(
     ItemList,
     {
       itemListItems: filteredItemsList,
@@ -3976,7 +3993,7 @@ var ItemSelector = ({
       onDebounce,
       categoryItemContentTemplate
     }
-  ) : /* @__PURE__ */ React65.createElement(
+  ) : /* @__PURE__ */ React66.createElement(
     Stack9,
     {
       alignItems: "center",
@@ -3986,16 +4003,16 @@ var ItemSelector = ({
       gap: 1.5,
       overflow: "hidden"
     },
-    /* @__PURE__ */ React65.createElement(IconComponent, { fontSize: "large" }),
-    /* @__PURE__ */ React65.createElement(Box9, { sx: { maxWidth: 160, overflow: "hidden" } }, /* @__PURE__ */ React65.createElement(Typography5, { align: "center", variant: "subtitle2", color: "text.secondary" }, __21("Sorry, nothing matched", "elementor")), /* @__PURE__ */ React65.createElement(
+    /* @__PURE__ */ React66.createElement(IconComponent, { fontSize: "large" }),
+    /* @__PURE__ */ React66.createElement(Box9, { sx: { maxWidth: 160, overflow: "hidden" } }, /* @__PURE__ */ React66.createElement(Typography5, { align: "center", variant: "subtitle2", color: "text.secondary" }, __21("Sorry, nothing matched", "elementor")), /* @__PURE__ */ React66.createElement(
       Typography5,
       {
         variant: "subtitle2",
         color: "text.secondary",
         sx: { display: "flex", width: "100%", justifyContent: "center" }
       },
-      /* @__PURE__ */ React65.createElement("span", null, "\u201C"),
-      /* @__PURE__ */ React65.createElement(
+      /* @__PURE__ */ React66.createElement("span", null, "\u201C"),
+      /* @__PURE__ */ React66.createElement(
         Box9,
         {
           component: "span",
@@ -4003,9 +4020,9 @@ var ItemSelector = ({
         },
         searchValue
       ),
-      /* @__PURE__ */ React65.createElement("span", null, "\u201D.")
+      /* @__PURE__ */ React66.createElement("span", null, "\u201D.")
     )),
-    /* @__PURE__ */ React65.createElement(
+    /* @__PURE__ */ React66.createElement(
       Typography5,
       {
         align: "center",
@@ -4014,7 +4031,7 @@ var ItemSelector = ({
         sx: { display: "flex", flexDirection: "column" }
       },
       __21("Try something else.", "elementor"),
-      /* @__PURE__ */ React65.createElement(
+      /* @__PURE__ */ React66.createElement(
         Link,
         {
           color: "secondary",
@@ -4046,7 +4063,7 @@ var ItemList = ({
     });
   }, 100);
   const memoizedItemStyle = useCallback3((item) => itemStyle(item), [itemStyle]);
-  return /* @__PURE__ */ React65.createElement(
+  return /* @__PURE__ */ React66.createElement(
     PopoverMenuList,
     {
       items: itemListItems,
@@ -4089,13 +4106,13 @@ var FontFamilyControl = createControl(
         items: fonts
       }));
     }, [fontFamilies]);
-    return /* @__PURE__ */ React66.createElement(React66.Fragment, null, /* @__PURE__ */ React66.createElement(ControlActions, null, /* @__PURE__ */ React66.createElement(
+    return /* @__PURE__ */ React67.createElement(React67.Fragment, null, /* @__PURE__ */ React67.createElement(ControlActions, null, /* @__PURE__ */ React67.createElement(
       UnstableTag2,
       {
         id: "font-family-control",
         variant: "outlined",
         label: fontFamily || placeholder,
-        endIcon: /* @__PURE__ */ React66.createElement(ChevronDownIcon2, { fontSize: "tiny" }),
+        endIcon: /* @__PURE__ */ React67.createElement(ChevronDownIcon2, { fontSize: "tiny" }),
         ...bindTrigger4(popoverState),
         fullWidth: true,
         disabled,
@@ -4107,7 +4124,7 @@ var FontFamilyControl = createControl(
           textTransform: "capitalize"
         } : void 0
       }
-    )), /* @__PURE__ */ React66.createElement(
+    )), /* @__PURE__ */ React67.createElement(
       Popover5,
       {
         disablePortal: true,
@@ -4117,7 +4134,7 @@ var FontFamilyControl = createControl(
         sx: { my: 1.5 },
         ...bindPopover5(popoverState)
       },
-      /* @__PURE__ */ React66.createElement(
+      /* @__PURE__ */ React67.createElement(
         ItemSelector,
         {
           id: "font-family-selector",
@@ -4137,7 +4154,7 @@ var FontFamilyControl = createControl(
 );
 
 // src/controls/url-control.tsx
-import * as React67 from "react";
+import * as React68 from "react";
 import { urlPropTypeUtil as urlPropTypeUtil2 } from "@elementor/editor-props";
 import { TextField as TextField7 } from "@elementor/ui";
 var UrlControl = createControl(
@@ -4145,7 +4162,7 @@ var UrlControl = createControl(
     const { value, setValue, disabled, placeholder: boundPlaceholder } = useBoundProp(urlPropTypeUtil2);
     const handleChange = (event) => setValue(event.target.value);
     const placeholder = propPlaceholder ?? boundPlaceholder ?? void 0;
-    return /* @__PURE__ */ React67.createElement(ControlActions, null, /* @__PURE__ */ React67.createElement(
+    return /* @__PURE__ */ React68.createElement(ControlActions, null, /* @__PURE__ */ React68.createElement(
       TextField7,
       {
         size: "tiny",
@@ -4163,7 +4180,7 @@ var UrlControl = createControl(
 );
 
 // src/controls/link-control.tsx
-import * as React72 from "react";
+import * as React73 from "react";
 import { useEffect as useEffect13, useMemo as useMemo10, useState as useState12 } from "react";
 import { getLinkInLinkRestriction } from "@elementor/editor-elements";
 import { linkPropTypeUtil } from "@elementor/editor-props";
@@ -4174,7 +4191,7 @@ import { debounce as debounce3 } from "@elementor/utils";
 import { __ as __25 } from "@wordpress/i18n";
 
 // src/components/restricted-link-infotip.tsx
-import * as React68 from "react";
+import * as React69 from "react";
 import { selectElement } from "@elementor/editor-elements";
 import { InfoCircleFilledIcon } from "@elementor/icons";
 import { Alert, AlertAction, AlertTitle, Box as Box10, Infotip as Infotip2, Link as Link2 } from "@elementor/ui";
@@ -4204,13 +4221,13 @@ var RestrictedLinkInfotip = ({
       selectElement(elementId);
     }
   };
-  const content = /* @__PURE__ */ React68.createElement(
+  const content = /* @__PURE__ */ React69.createElement(
     Alert,
     {
       color: "secondary",
-      icon: /* @__PURE__ */ React68.createElement(InfoCircleFilledIcon, null),
+      icon: /* @__PURE__ */ React69.createElement(InfoCircleFilledIcon, null),
       size: "small",
-      action: /* @__PURE__ */ React68.createElement(
+      action: /* @__PURE__ */ React69.createElement(
         AlertAction,
         {
           sx: { width: "fit-content" },
@@ -4221,10 +4238,10 @@ var RestrictedLinkInfotip = ({
         __23("Take me there", "elementor")
       )
     },
-    /* @__PURE__ */ React68.createElement(AlertTitle, null, __23("Nested links", "elementor")),
-    /* @__PURE__ */ React68.createElement(Box10, { component: "span" }, INFOTIP_CONTENT[reason ?? "descendant"], " ", /* @__PURE__ */ React68.createElement(Link2, { href: learnMoreButton.href, target: "_blank", color: "info.main" }, learnMoreButton.label))
+    /* @__PURE__ */ React69.createElement(AlertTitle, null, __23("Nested links", "elementor")),
+    /* @__PURE__ */ React69.createElement(Box10, { component: "span" }, INFOTIP_CONTENT[reason ?? "descendant"], " ", /* @__PURE__ */ React69.createElement(Link2, { href: learnMoreButton.href, target: "_blank", color: "info.main" }, learnMoreButton.label))
   );
-  return shouldRestrict && isVisible ? /* @__PURE__ */ React68.createElement(
+  return shouldRestrict && isVisible ? /* @__PURE__ */ React69.createElement(
     Infotip2,
     {
       placement: "right",
@@ -4232,26 +4249,18 @@ var RestrictedLinkInfotip = ({
       color: "secondary",
       slotProps: { popper: { sx: { width: 300 } } }
     },
-    /* @__PURE__ */ React68.createElement(Box10, null, children)
-  ) : /* @__PURE__ */ React68.createElement(React68.Fragment, null, children);
+    /* @__PURE__ */ React69.createElement(Box10, null, children)
+  ) : /* @__PURE__ */ React69.createElement(React69.Fragment, null, children);
 };
 
 // src/controls/query-control.tsx
-import * as React70 from "react";
-import { useMemo as useMemo9, useState as useState11 } from "react";
-import {
-  numberPropTypeUtil as numberPropTypeUtil2,
-  queryPropTypeUtil,
-  stringPropTypeUtil as stringPropTypeUtil9,
-  urlPropTypeUtil as urlPropTypeUtil3
-} from "@elementor/editor-props";
-import { httpService as httpService2 } from "@elementor/http-client";
+import * as React71 from "react";
+import { numberPropTypeUtil as numberPropTypeUtil3, queryPropTypeUtil, stringPropTypeUtil as stringPropTypeUtil10, urlPropTypeUtil as urlPropTypeUtil3 } from "@elementor/editor-props";
 import { SearchIcon } from "@elementor/icons";
-import { debounce as debounce2 } from "@elementor/utils";
 import { __ as __24 } from "@wordpress/i18n";
 
 // src/components/autocomplete.tsx
-import * as React69 from "react";
+import * as React70 from "react";
 import { forwardRef as forwardRef9 } from "react";
 import { XIcon as XIcon2 } from "@elementor/icons";
 import {
@@ -4283,7 +4292,7 @@ var Autocomplete2 = forwardRef9((props, ref) => {
   const valueLength = value?.toString()?.length ?? 0;
   const meetsMinLength = valueLength >= minInputLength;
   const shouldOpen = meetsMinLength && (allowCustomValues ? optionKeys.length > 0 : true);
-  return /* @__PURE__ */ React69.createElement(
+  return /* @__PURE__ */ React70.createElement(
     AutocompleteBase,
     {
       ...restProps,
@@ -4304,8 +4313,8 @@ var Autocomplete2 = forwardRef9((props, ref) => {
       groupBy: isCategorizedOptionPool(options) ? (optionId) => findMatchingOption(options, optionId)?.groupLabel || optionId : void 0,
       isOptionEqualToValue,
       filterOptions: () => optionKeys,
-      renderOption: (optionProps, optionId) => /* @__PURE__ */ React69.createElement(Box11, { component: "li", ...optionProps, key: optionProps.id }, findMatchingOption(options, optionId)?.label ?? optionId),
-      renderInput: (params) => /* @__PURE__ */ React69.createElement(
+      renderOption: (optionProps, optionId) => /* @__PURE__ */ React70.createElement(Box11, { component: "li", ...optionProps, key: optionProps.id }, findMatchingOption(options, optionId)?.label ?? optionId),
+      renderInput: (params) => /* @__PURE__ */ React70.createElement(
         TextInput,
         {
           params,
@@ -4332,7 +4341,7 @@ var TextInput = ({
   const onChange = (event) => {
     handleChange(event.target.value);
   };
-  return /* @__PURE__ */ React69.createElement(
+  return /* @__PURE__ */ React70.createElement(
     TextField8,
     {
       ...params,
@@ -4347,7 +4356,7 @@ var TextInput = ({
       InputProps: {
         ...params.InputProps,
         startAdornment: startAdornment || params.InputProps.startAdornment,
-        endAdornment: /* @__PURE__ */ React69.createElement(ClearButton, { params, allowClear, handleChange })
+        endAdornment: /* @__PURE__ */ React70.createElement(ClearButton, { params, allowClear, handleChange })
       }
     }
   );
@@ -4356,7 +4365,7 @@ var ClearButton = ({
   allowClear,
   handleChange,
   params
-}) => /* @__PURE__ */ React69.createElement(InputAdornment5, { position: "end" }, allowClear && /* @__PURE__ */ React69.createElement(IconButton5, { size: params.size, onClick: () => handleChange(null), sx: { cursor: "pointer" } }, /* @__PURE__ */ React69.createElement(XIcon2, { fontSize: params.size })));
+}) => /* @__PURE__ */ React70.createElement(InputAdornment5, { position: "end" }, allowClear && /* @__PURE__ */ React70.createElement(IconButton5, { size: params.size, onClick: () => handleChange(null), sx: { cursor: "pointer" } }, /* @__PURE__ */ React70.createElement(XIcon2, { fontSize: params.size })));
 function findMatchingOption(options, optionId = null) {
   const formattedOption = (optionId || "").toString();
   return options.find(({ id }) => formattedOption === id.toString());
@@ -4381,6 +4390,79 @@ function factoryFilter(newValue, options, minInputLength) {
   );
 }
 
+// src/hooks/use-query-autocomplete.ts
+import { useMemo as useMemo9, useState as useState11 } from "react";
+import { numberPropTypeUtil as numberPropTypeUtil2, stringPropTypeUtil as stringPropTypeUtil9 } from "@elementor/editor-props";
+import { httpService as httpService2 } from "@elementor/http-client";
+import { debounce as debounce2 } from "@elementor/utils";
+function useQueryAutocomplete({
+  url,
+  params = {},
+  minInputLength = 2,
+  initialQueryValue = null,
+  excludeIds
+}) {
+  const excludeIdSet = useMemo9(() => new Set((excludeIds ?? []).map(String)), [excludeIds]);
+  const [options, setOptions] = useState11(
+    generateFirstLoadedOption(initialQueryValue)
+  );
+  const debounceFetch = useMemo9(
+    () => debounce2(
+      (queryParams) => fetchOptions(url, queryParams).then((newOptions) => {
+        setOptions(formatOptions(filterExcludedOptions(newOptions, excludeIdSet)));
+      }),
+      400
+    ),
+    [url, excludeIdSet]
+  );
+  const updateOptions = (term) => {
+    setOptions([]);
+    if (!term || !url || term.length < minInputLength) {
+      return;
+    }
+    debounceFetch({ ...params, term });
+  };
+  return { options, updateOptions };
+}
+async function fetchOptions(ajaxUrl, params) {
+  if (!params || !ajaxUrl) {
+    return [];
+  }
+  try {
+    const { data: response } = await httpService2().get(ajaxUrl, { params });
+    return response.data.value;
+  } catch {
+    return [];
+  }
+}
+function formatOptions(options) {
+  const compareKey = isCategorizedOptionPool(options) ? "groupLabel" : "label";
+  return options.sort(
+    (a, b) => a[compareKey] && b[compareKey] ? a[compareKey].localeCompare(b[compareKey]) : 0
+  );
+}
+function filterExcludedOptions(options, excludeIdSet) {
+  if (excludeIdSet.size === 0) {
+    return options;
+  }
+  return options.filter((option) => !excludeIdSet.has(String(option.id)));
+}
+function extractFlatOptionFromQueryValue(queryValue) {
+  const id = numberPropTypeUtil2.extract(queryValue?.id);
+  const label = stringPropTypeUtil9.extract(queryValue?.label);
+  if (id === null) {
+    return null;
+  }
+  return {
+    id: String(id),
+    label: label || String(id)
+  };
+}
+function generateFirstLoadedOption(queryValue) {
+  const option = extractFlatOptionFromQueryValue(queryValue);
+  return option ? [option] : [];
+}
+
 // src/controls/query-control.tsx
 var QueryControl = createControl((props) => {
   const { value: queryValue, setValue: setQueryValue } = useBoundProp(queryPropTypeUtil);
@@ -4393,9 +4475,12 @@ var QueryControl = createControl((props) => {
     onSetValue,
     ariaLabel
   } = props || {};
-  const [options, setOptions] = useState11(
-    generateFirstLoadedOption(queryValue)
-  );
+  const { options, updateOptions } = useQueryAutocomplete({
+    url,
+    params,
+    minInputLength,
+    initialQueryValue: queryValue
+  });
   const onOptionChange = (newValue) => {
     if (newValue === null) {
       setQueryValue(null);
@@ -4403,8 +4488,8 @@ var QueryControl = createControl((props) => {
       return;
     }
     const newQueryValue = {
-      id: numberPropTypeUtil2.create(newValue),
-      label: stringPropTypeUtil9.create(findMatchingOption(options, newValue)?.label || null)
+      id: numberPropTypeUtil3.create(newValue),
+      label: stringPropTypeUtil10.create(findMatchingOption(options, newValue)?.label || null)
     };
     setQueryValue(newQueryValue);
     onSetValue?.(queryPropTypeUtil.create(newQueryValue));
@@ -4420,30 +4505,14 @@ var QueryControl = createControl((props) => {
     onSetValue?.(urlPropTypeUtil3.create(trimmedValue));
     updateOptions(newValue);
   };
-  const updateOptions = (newValue) => {
-    setOptions([]);
-    if (!newValue || !url || newValue.length < minInputLength) {
-      return;
-    }
-    debounceFetch({ ...params, term: newValue });
-  };
-  const debounceFetch = useMemo9(
-    () => debounce2(
-      (queryParams) => fetchOptions(url, queryParams).then((newOptions) => {
-        setOptions(formatOptions(newOptions));
-      }),
-      400
-    ),
-    [url]
-  );
   const displayValue = queryValue?.id?.value ?? urlValue;
-  return /* @__PURE__ */ React70.createElement(ControlActions, null, /* @__PURE__ */ React70.createElement(
+  return /* @__PURE__ */ React71.createElement(ControlActions, null, /* @__PURE__ */ React71.createElement(
     Autocomplete2,
     {
       options,
       allowCustomValues,
       placeholder: urlPlaceholder ?? placeholder,
-      startAdornment: /* @__PURE__ */ React70.createElement(SearchIcon, { fontSize: "tiny" }),
+      startAdornment: /* @__PURE__ */ React71.createElement(SearchIcon, { fontSize: "tiny" }),
       value: displayValue,
       onOptionChange,
       onTextChange,
@@ -4455,35 +4524,9 @@ var QueryControl = createControl((props) => {
     }
   ));
 });
-async function fetchOptions(ajaxUrl, params) {
-  if (!params || !ajaxUrl) {
-    return [];
-  }
-  try {
-    const { data: response } = await httpService2().get(ajaxUrl, { params });
-    return response.data.value;
-  } catch {
-    return [];
-  }
-}
-function formatOptions(options) {
-  const compareKey = isCategorizedOptionPool(options) ? "groupLabel" : "label";
-  return options.sort(
-    (a, b) => a[compareKey] && b[compareKey] ? a[compareKey].localeCompare(b[compareKey]) : 0
-  );
-}
-function generateFirstLoadedOption(queryValue) {
-  const id = queryValue?.id?.value;
-  const label = queryValue?.label?.value;
-  const option = [];
-  if (id && label) {
-    option.push({ id: id.toString(), label });
-  }
-  return option;
-}
 
 // src/controls/switch-control.tsx
-import * as React71 from "react";
+import * as React72 from "react";
 import { booleanPropTypeUtil } from "@elementor/editor-props";
 import { Box as Box12, Switch } from "@elementor/ui";
 var SwitchControl = createControl(() => {
@@ -4491,7 +4534,7 @@ var SwitchControl = createControl(() => {
   const handleChange = (event) => {
     setValue(event.target.checked);
   };
-  return /* @__PURE__ */ React71.createElement(Box12, { sx: { display: "flex", justifyContent: "flex-end" } }, /* @__PURE__ */ React71.createElement(
+  return /* @__PURE__ */ React72.createElement(Box12, { sx: { display: "flex", justifyContent: "flex-end" } }, /* @__PURE__ */ React72.createElement(
     Switch,
     {
       checked: !!(value || placeholder),
@@ -4574,7 +4617,7 @@ var LinkControl = createControl((props) => {
     } : null;
     setLinkSessionValue({ ...linkSessionValue, value: valueToSave });
   };
-  return /* @__PURE__ */ React72.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React72.createElement(Stack10, { gap: 1.5 }, /* @__PURE__ */ React72.createElement(
+  return /* @__PURE__ */ React73.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React73.createElement(Stack10, { gap: 1.5 }, /* @__PURE__ */ React73.createElement(
     Stack10,
     {
       direction: "row",
@@ -4584,8 +4627,8 @@ var LinkControl = createControl((props) => {
         marginInlineEnd: -0.75
       }
     },
-    /* @__PURE__ */ React72.createElement(ControlLabel, null, label),
-    /* @__PURE__ */ React72.createElement(RestrictedLinkInfotip, { isVisible: !isActive, linkInLinkRestriction }, /* @__PURE__ */ React72.createElement(
+    /* @__PURE__ */ React73.createElement(ControlLabel, null, label),
+    /* @__PURE__ */ React73.createElement(RestrictedLinkInfotip, { isVisible: !isActive, linkInLinkRestriction }, /* @__PURE__ */ React73.createElement(
       IconButton6,
       {
         size: SIZE8,
@@ -4593,9 +4636,9 @@ var LinkControl = createControl((props) => {
         "aria-label": __25("Toggle link", "elementor"),
         disabled: shouldDisableAddingLink
       },
-      isActive ? /* @__PURE__ */ React72.createElement(MinusIcon, { fontSize: SIZE8 }) : /* @__PURE__ */ React72.createElement(PlusIcon2, { fontSize: SIZE8 })
+      isActive ? /* @__PURE__ */ React73.createElement(MinusIcon, { fontSize: SIZE8 }) : /* @__PURE__ */ React73.createElement(PlusIcon2, { fontSize: SIZE8 })
     ))
-  ), /* @__PURE__ */ React72.createElement(Collapse, { in: isActive, timeout: "auto", unmountOnExit: true }, /* @__PURE__ */ React72.createElement(Stack10, { gap: 1.5 }, /* @__PURE__ */ React72.createElement(PropKeyProvider, { bind: "destination" }, /* @__PURE__ */ React72.createElement(
+  ), /* @__PURE__ */ React73.createElement(Collapse, { in: isActive, timeout: "auto", unmountOnExit: true }, /* @__PURE__ */ React73.createElement(Stack10, { gap: 1.5 }, /* @__PURE__ */ React73.createElement(PropKeyProvider, { bind: "destination" }, /* @__PURE__ */ React73.createElement(
     QueryControl,
     {
       queryOptions,
@@ -4605,29 +4648,29 @@ var LinkControl = createControl((props) => {
       onSetValue: onSaveValueToSession,
       ariaLabel: ariaLabel || label
     }
-  )), /* @__PURE__ */ React72.createElement(PropKeyProvider, { bind: "isTargetBlank" }, /* @__PURE__ */ React72.createElement(Grid10, { container: true, alignItems: "center", flexWrap: "nowrap", justifyContent: "space-between" }, /* @__PURE__ */ React72.createElement(Grid10, { item: true }, /* @__PURE__ */ React72.createElement(ControlFormLabel, null, __25("Open in a new tab", "elementor"))), /* @__PURE__ */ React72.createElement(Grid10, { item: true, sx: { marginInlineEnd: -1 } }, /* @__PURE__ */ React72.createElement(SwitchControl, null))))))));
+  )), /* @__PURE__ */ React73.createElement(PropKeyProvider, { bind: "isTargetBlank" }, /* @__PURE__ */ React73.createElement(Grid10, { container: true, alignItems: "center", flexWrap: "nowrap", justifyContent: "space-between" }, /* @__PURE__ */ React73.createElement(Grid10, { item: true }, /* @__PURE__ */ React73.createElement(ControlFormLabel, null, __25("Open in a new tab", "elementor"))), /* @__PURE__ */ React73.createElement(Grid10, { item: true, sx: { marginInlineEnd: -1 } }, /* @__PURE__ */ React73.createElement(SwitchControl, null))))))));
 });
 
 // src/controls/html-tag-control.tsx
-import * as React74 from "react";
+import * as React75 from "react";
 import { getElementLabel } from "@elementor/editor-elements";
-import { stringPropTypeUtil as stringPropTypeUtil10 } from "@elementor/editor-props";
+import { stringPropTypeUtil as stringPropTypeUtil11 } from "@elementor/editor-props";
 import { MenuListItem as MenuListItem4 } from "@elementor/editor-ui";
 import { Select as Select2, styled as styled8, Typography as Typography6 } from "@elementor/ui";
 import { __ as __26 } from "@wordpress/i18n";
 
 // src/components/conditional-control-infotip.tsx
-import * as React73 from "react";
+import * as React74 from "react";
 import { InfoAlert } from "@elementor/editor-ui";
 import { AlertTitle as AlertTitle2, Box as Box13, Infotip as Infotip3, useTheme as useTheme2 } from "@elementor/ui";
 import { DirectionProvider } from "@elementor/ui";
 var DEFAULT_COLOR = "secondary";
-var ConditionalControlInfotip = React73.forwardRef(
+var ConditionalControlInfotip = React74.forwardRef(
   ({ children, title, description, alertProps, infotipProps, ...props }, ref) => {
     const theme = useTheme2();
     const isUiRtl = "rtl" === theme.direction;
     const isEnabled = props.isEnabled && (title || description);
-    return /* @__PURE__ */ React73.createElement(Box13, { ref }, isEnabled ? /* @__PURE__ */ React73.createElement(DirectionProvider, { rtl: isUiRtl }, /* @__PURE__ */ React73.createElement(
+    return /* @__PURE__ */ React74.createElement(Box13, { ref }, isEnabled ? /* @__PURE__ */ React74.createElement(DirectionProvider, { rtl: isUiRtl }, /* @__PURE__ */ React74.createElement(
       Infotip3,
       {
         placement: "right",
@@ -4645,14 +4688,14 @@ var ConditionalControlInfotip = React73.forwardRef(
           }
         },
         ...infotipProps,
-        content: /* @__PURE__ */ React73.createElement(
+        content: /* @__PURE__ */ React74.createElement(
           InfoAlert,
           {
             color: DEFAULT_COLOR,
             sx: { width: 300, px: 1.5, py: 2 },
             ...alertProps
           },
-          /* @__PURE__ */ React73.createElement(Box13, { sx: { flexDirection: "column", display: "flex", gap: 0.5 } }, /* @__PURE__ */ React73.createElement(AlertTitle2, null, title), /* @__PURE__ */ React73.createElement(Box13, null, description))
+          /* @__PURE__ */ React74.createElement(Box13, { sx: { flexDirection: "column", display: "flex", gap: 0.5 } }, /* @__PURE__ */ React74.createElement(AlertTitle2, null, title), /* @__PURE__ */ React74.createElement(Box13, null, description))
         )
       },
       children
@@ -4669,7 +4712,7 @@ var HtmlTagControl = createControl((props) => {
     fallbackLabels = {},
     context: { elementId }
   } = props;
-  const { value, setValue, disabled, placeholder } = useBoundProp(stringPropTypeUtil10);
+  const { value, setValue, disabled, placeholder } = useBoundProp(stringPropTypeUtil11);
   const handleChange = (event) => {
     const newValue = event.target.value || null;
     onChange?.(newValue, value);
@@ -4694,10 +4737,10 @@ var HtmlTagControl = createControl((props) => {
     }
     const placeholderOption = findOptionByValue(placeholder);
     const displayText = placeholderOption?.label || placeholder;
-    return /* @__PURE__ */ React74.createElement(Typography6, { component: "span", variant: "caption", color: "text.tertiary" }, displayText);
+    return /* @__PURE__ */ React75.createElement(Typography6, { component: "span", variant: "caption", color: "text.tertiary" }, displayText);
   };
   const findOptionByValue = (searchValue) => options.find((opt) => opt.value === searchValue);
-  return /* @__PURE__ */ React74.createElement(ControlActions, null, /* @__PURE__ */ React74.createElement(ConditionalControlInfotip, { ...infoTipProps }, /* @__PURE__ */ React74.createElement(
+  return /* @__PURE__ */ React75.createElement(ControlActions, null, /* @__PURE__ */ React75.createElement(ConditionalControlInfotip, { ...infoTipProps }, /* @__PURE__ */ React75.createElement(
     StyledSelect,
     {
       sx: { overflow: "hidden", cursor: disabled ? "not-allowed" : void 0 },
@@ -4709,12 +4752,87 @@ var HtmlTagControl = createControl((props) => {
       disabled,
       fullWidth: true
     },
-    options.map(({ label, ...itemProps }) => /* @__PURE__ */ React74.createElement(MenuListItem4, { key: itemProps.value, ...itemProps, value: itemProps.value ?? "" }, label))
+    options.map(({ label, ...itemProps }) => /* @__PURE__ */ React75.createElement(MenuListItem4, { key: itemProps.value, ...itemProps, value: itemProps.value ?? "" }, label))
   )));
 });
 
+// src/controls/query-chips-control.tsx
+import * as React76 from "react";
+import { useMemo as useMemo11 } from "react";
+import {
+  createArrayPropUtils,
+  numberPropTypeUtil as numberPropTypeUtil4,
+  queryPropTypeUtil as queryPropTypeUtil2,
+  stringPropTypeUtil as stringPropTypeUtil12
+} from "@elementor/editor-props";
+import { Autocomplete as Autocomplete3, TextField as TextField9 } from "@elementor/ui";
+import { __ as __27 } from "@wordpress/i18n";
+var queryArrayPropTypeUtil = createArrayPropUtils(queryPropTypeUtil2.key, queryPropTypeUtil2.schema);
+var SIZE9 = "tiny";
+var QueryChipsControl = createControl((props) => {
+  const { queryOptions, placeholder, minInputLength = 2 } = props;
+  const { value, setValue, disabled } = useBoundProp(queryArrayPropTypeUtil);
+  const selectedChips = useMemo11(() => extractChips(value), [value]);
+  const excludeIds = useMemo11(
+    () => selectedChips.map((chip) => Number(chip.id)).filter((id) => Number.isFinite(id)),
+    [selectedChips]
+  );
+  const { options, updateOptions } = useQueryAutocomplete({
+    url: queryOptions.url,
+    params: queryOptions.params,
+    minInputLength,
+    excludeIds
+  });
+  const handleChange = (_, newValue) => {
+    setValue(
+      newValue.map(
+        (option) => queryPropTypeUtil2.create({
+          id: numberPropTypeUtil4.create(Number(option.id)),
+          label: stringPropTypeUtil12.create(option.label)
+        })
+      )
+    );
+  };
+  const handleInputChange = (_, term) => {
+    updateOptions(term || null);
+  };
+  return /* @__PURE__ */ React76.createElement(ControlActions, null, /* @__PURE__ */ React76.createElement(
+    Autocomplete3,
+    {
+      multiple: true,
+      fullWidth: true,
+      disableClearable: true,
+      forcePopupIcon: false,
+      disabled,
+      size: SIZE9,
+      value: selectedChips,
+      options,
+      onChange: handleChange,
+      onInputChange: handleInputChange,
+      getOptionLabel: (option) => option.label,
+      isOptionEqualToValue: (option, val) => option.id === val.id,
+      filterOptions: (opts) => opts,
+      renderTags: (tagValues, getTagProps) => /* @__PURE__ */ React76.createElement(
+        ChipsList,
+        {
+          getLabel: (option) => option.label,
+          getTagProps,
+          values: tagValues
+        }
+      ),
+      renderInput: (params) => /* @__PURE__ */ React76.createElement(TextField9, { ...params, placeholder: placeholder ?? __27("Search", "elementor") })
+    }
+  ));
+});
+function extractChips(value) {
+  if (!value) {
+    return [];
+  }
+  return value.map((item) => extractFlatOptionFromQueryValue(item?.value)).filter((chip) => chip !== null);
+}
+
 // src/controls/gap-control.tsx
-import * as React75 from "react";
+import * as React77 from "react";
 import { useLayoutEffect as useLayoutEffect2, useRef as useRef13, useState as useState13 } from "react";
 import {
   layoutDirectionPropTypeUtil,
@@ -4723,7 +4841,7 @@ import {
 import { useActiveBreakpoint as useActiveBreakpoint5 } from "@elementor/editor-responsive";
 import { DetachIcon as DetachIcon2, LinkIcon as LinkIcon2 } from "@elementor/icons";
 import { Grid as Grid11, Stack as Stack11, Tooltip as Tooltip7 } from "@elementor/ui";
-import { __ as __27 } from "@wordpress/i18n";
+import { __ as __28 } from "@wordpress/i18n";
 var GapControl = ({ label }) => {
   const stackRef = useRef13(null);
   const { disabled: sizeDisabled } = useBoundProp(sizePropTypeUtil6);
@@ -4771,8 +4889,8 @@ var GapControl = ({ label }) => {
   };
   const tooltipLabel = label.toLowerCase();
   const LinkedIcon = isLinked ? LinkIcon2 : DetachIcon2;
-  const linkedLabel = __27("Link %s", "elementor").replace("%s", tooltipLabel);
-  const unlinkedLabel = __27("Unlink %s", "elementor").replace("%s", tooltipLabel);
+  const linkedLabel = __28("Link %s", "elementor").replace("%s", tooltipLabel);
+  const unlinkedLabel = __28("Unlink %s", "elementor").replace("%s", tooltipLabel);
   const disabled = sizeDisabled || directionDisabled;
   const propProviderProps = {
     propType,
@@ -4792,7 +4910,7 @@ var GapControl = ({ label }) => {
     }
     return sizePropTypeUtil6.extract(directionPlaceholder?.[bind]);
   };
-  return /* @__PURE__ */ React75.createElement(PropProvider, { ...propProviderProps }, /* @__PURE__ */ React75.createElement(Stack11, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React75.createElement(ControlLabel, null, label), /* @__PURE__ */ React75.createElement(Tooltip7, { title: isLinked ? unlinkedLabel : linkedLabel, placement: "top" }, /* @__PURE__ */ React75.createElement(
+  return /* @__PURE__ */ React77.createElement(PropProvider, { ...propProviderProps }, /* @__PURE__ */ React77.createElement(Stack11, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React77.createElement(ControlLabel, null, label), /* @__PURE__ */ React77.createElement(Tooltip7, { title: isLinked ? unlinkedLabel : linkedLabel, placement: "top" }, /* @__PURE__ */ React77.createElement(
     StyledToggleButton,
     {
       "aria-label": isLinked ? unlinkedLabel : linkedLabel,
@@ -4804,21 +4922,21 @@ var GapControl = ({ label }) => {
       disabled,
       isPlaceholder: hasPlaceholders
     },
-    /* @__PURE__ */ React75.createElement(LinkedIcon, { fontSize: "tiny" })
-  ))), /* @__PURE__ */ React75.createElement(Stack11, { direction: "row", gap: 2, flexWrap: "nowrap", ref: stackRef }, /* @__PURE__ */ React75.createElement(Grid11, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React75.createElement(Grid11, { item: true, xs: 12 }, /* @__PURE__ */ React75.createElement(ControlFormLabel, null, __27("Column", "elementor"))), /* @__PURE__ */ React75.createElement(Grid11, { item: true, xs: 12 }, /* @__PURE__ */ React75.createElement(
+    /* @__PURE__ */ React77.createElement(LinkedIcon, { fontSize: "tiny" })
+  ))), /* @__PURE__ */ React77.createElement(Stack11, { direction: "row", gap: 2, flexWrap: "nowrap", ref: stackRef }, /* @__PURE__ */ React77.createElement(Grid11, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React77.createElement(Grid11, { item: true, xs: 12 }, /* @__PURE__ */ React77.createElement(ControlFormLabel, null, __28("Column", "elementor"))), /* @__PURE__ */ React77.createElement(Grid11, { item: true, xs: 12 }, /* @__PURE__ */ React77.createElement(
     Control4,
     {
       bind: "column",
-      ariaLabel: __27("Column gap", "elementor"),
+      ariaLabel: __28("Column gap", "elementor"),
       isLinked,
       anchorRef: stackRef,
       placeholder: getEffectivePlaceholder("column") ?? void 0
     }
-  ))), /* @__PURE__ */ React75.createElement(Grid11, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React75.createElement(Grid11, { item: true, xs: 12 }, /* @__PURE__ */ React75.createElement(ControlFormLabel, null, __27("Row", "elementor"))), /* @__PURE__ */ React75.createElement(Grid11, { item: true, xs: 12 }, /* @__PURE__ */ React75.createElement(
+  ))), /* @__PURE__ */ React77.createElement(Grid11, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React77.createElement(Grid11, { item: true, xs: 12 }, /* @__PURE__ */ React77.createElement(ControlFormLabel, null, __28("Row", "elementor"))), /* @__PURE__ */ React77.createElement(Grid11, { item: true, xs: 12 }, /* @__PURE__ */ React77.createElement(
     Control4,
     {
       bind: "row",
-      ariaLabel: __27("Row gap", "elementor"),
+      ariaLabel: __28("Row gap", "elementor"),
       isLinked,
       anchorRef: stackRef,
       placeholder: getEffectivePlaceholder("row") ?? void 0
@@ -4833,21 +4951,21 @@ var Control4 = ({
   placeholder
 }) => {
   if (isLinked) {
-    return /* @__PURE__ */ React75.createElement(UnstableSizeControl, { anchorRef, placeholder, ariaLabel });
+    return /* @__PURE__ */ React77.createElement(UnstableSizeControl, { anchorRef, placeholder, ariaLabel });
   }
-  return /* @__PURE__ */ React75.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React75.createElement(UnstableSizeControl, { anchorRef, placeholder, ariaLabel }));
+  return /* @__PURE__ */ React77.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React77.createElement(UnstableSizeControl, { anchorRef, placeholder, ariaLabel }));
 };
 
 // src/controls/aspect-ratio-control.tsx
-import * as React76 from "react";
+import * as React78 from "react";
 import { useEffect as useEffect14, useState as useState14 } from "react";
-import { stringPropTypeUtil as stringPropTypeUtil11 } from "@elementor/editor-props";
+import { stringPropTypeUtil as stringPropTypeUtil13 } from "@elementor/editor-props";
 import { MenuListItem as MenuListItem5 } from "@elementor/editor-ui";
 import { ArrowsMoveHorizontalIcon, ArrowsMoveVerticalIcon } from "@elementor/icons";
-import { Grid as Grid12, Select as Select3, Stack as Stack12, TextField as TextField9 } from "@elementor/ui";
-import { __ as __28 } from "@wordpress/i18n";
+import { Grid as Grid12, Select as Select3, Stack as Stack12, TextField as TextField10 } from "@elementor/ui";
+import { __ as __29 } from "@wordpress/i18n";
 var RATIO_OPTIONS = [
-  { label: __28("Auto", "elementor"), value: "auto" },
+  { label: __29("Auto", "elementor"), value: "auto" },
   { label: "1/1", value: "1/1" },
   { label: "4/3", value: "4/3" },
   { label: "3/4", value: "3/4" },
@@ -4863,7 +4981,7 @@ var AspectRatioControl = createControl(({ label }) => {
     setValue: setAspectRatioValue,
     disabled,
     placeholder: externalPlaceholder
-  } = useBoundProp(stringPropTypeUtil11);
+  } = useBoundProp(stringPropTypeUtil13);
   const aspectRatioValue = currentPropValue ?? externalPlaceholder;
   const isCustomSelected = aspectRatioValue && !RATIO_OPTIONS.some((option) => option.value === aspectRatioValue);
   const [initialWidth, initialHeight] = isCustomSelected ? aspectRatioValue.split("/") : ["", ""];
@@ -4914,7 +5032,7 @@ var AspectRatioControl = createControl(({ label }) => {
   };
   const lookup = currentPropValue ?? externalPlaceholder;
   const selectedOption = RATIO_OPTIONS.find((option) => option.value === lookup);
-  return /* @__PURE__ */ React76.createElement(ControlActions, null, /* @__PURE__ */ React76.createElement(Stack12, { direction: "column", gap: 2 }, /* @__PURE__ */ React76.createElement(Grid12, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React76.createElement(Grid12, { item: true, xs: 6 }, /* @__PURE__ */ React76.createElement(ControlLabel, null, label)), /* @__PURE__ */ React76.createElement(Grid12, { item: true, xs: 6 }, /* @__PURE__ */ React76.createElement(
+  return /* @__PURE__ */ React78.createElement(ControlActions, null, /* @__PURE__ */ React78.createElement(Stack12, { direction: "column", gap: 2 }, /* @__PURE__ */ React78.createElement(Grid12, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React78.createElement(Grid12, { item: true, xs: 6 }, /* @__PURE__ */ React78.createElement(ControlLabel, null, label)), /* @__PURE__ */ React78.createElement(Grid12, { item: true, xs: 6 }, /* @__PURE__ */ React78.createElement(
     Select3,
     {
       size: "tiny",
@@ -4926,11 +5044,11 @@ var AspectRatioControl = createControl(({ label }) => {
       renderValue: isCustomSelected ? void 0 : () => selectedOption?.label,
       fullWidth: true
     },
-    [...RATIO_OPTIONS, { label: __28("Custom", "elementor"), value: CUSTOM_RATIO }].map(
-      ({ label: optionLabel, ...props }) => /* @__PURE__ */ React76.createElement(MenuListItem5, { key: props.value, ...props, value: props.value ?? "" }, optionLabel)
+    [...RATIO_OPTIONS, { label: __29("Custom", "elementor"), value: CUSTOM_RATIO }].map(
+      ({ label: optionLabel, ...props }) => /* @__PURE__ */ React78.createElement(MenuListItem5, { key: props.value, ...props, value: props.value ?? "" }, optionLabel)
     )
-  ))), isCustom && /* @__PURE__ */ React76.createElement(Grid12, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React76.createElement(Grid12, { item: true, xs: 6 }, /* @__PURE__ */ React76.createElement(
-    TextField9,
+  ))), isCustom && /* @__PURE__ */ React78.createElement(Grid12, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React78.createElement(Grid12, { item: true, xs: 6 }, /* @__PURE__ */ React78.createElement(
+    TextField10,
     {
       size: "tiny",
       type: "number",
@@ -4939,11 +5057,11 @@ var AspectRatioControl = createControl(({ label }) => {
       value: customWidth,
       onChange: handleCustomWidthChange,
       InputProps: {
-        startAdornment: /* @__PURE__ */ React76.createElement(ArrowsMoveHorizontalIcon, { fontSize: "tiny" })
+        startAdornment: /* @__PURE__ */ React78.createElement(ArrowsMoveHorizontalIcon, { fontSize: "tiny" })
       }
     }
-  )), /* @__PURE__ */ React76.createElement(Grid12, { item: true, xs: 6 }, /* @__PURE__ */ React76.createElement(
-    TextField9,
+  )), /* @__PURE__ */ React78.createElement(Grid12, { item: true, xs: 6 }, /* @__PURE__ */ React78.createElement(
+    TextField10,
     {
       size: "tiny",
       type: "number",
@@ -4952,24 +5070,24 @@ var AspectRatioControl = createControl(({ label }) => {
       value: customHeight,
       onChange: handleCustomHeightChange,
       InputProps: {
-        startAdornment: /* @__PURE__ */ React76.createElement(ArrowsMoveVerticalIcon, { fontSize: "tiny" })
+        startAdornment: /* @__PURE__ */ React78.createElement(ArrowsMoveVerticalIcon, { fontSize: "tiny" })
       }
     }
   )))));
 });
 
 // src/controls/svg-media-control.tsx
-import * as React78 from "react";
+import * as React80 from "react";
 import { useState as useState16 } from "react";
 import { useCurrentUserCapabilities } from "@elementor/editor-current-user";
 import { svgSrcPropTypeUtil, urlPropTypeUtil as urlPropTypeUtil4 } from "@elementor/editor-props";
 import { UploadIcon as UploadIcon2 } from "@elementor/icons";
 import { Button as Button5, Card as Card2, CardMedia as CardMedia2, CardOverlay as CardOverlay2, CircularProgress as CircularProgress3, Stack as Stack13, styled as styled9, ThemeProvider } from "@elementor/ui";
 import { useWpMediaAttachment as useWpMediaAttachment2, useWpMediaFrame as useWpMediaFrame2 } from "@elementor/wp-media";
-import { __ as __30 } from "@wordpress/i18n";
+import { __ as __31 } from "@wordpress/i18n";
 
 // src/components/enable-unfiltered-modal.tsx
-import * as React77 from "react";
+import * as React79 from "react";
 import { useState as useState15 } from "react";
 import {
   Button as Button4,
@@ -4982,14 +5100,14 @@ import {
   DialogTitle,
   Divider as Divider3
 } from "@elementor/ui";
-import { __ as __29 } from "@wordpress/i18n";
-var ADMIN_TITLE_TEXT = __29("Enable Unfiltered Uploads", "elementor");
-var ADMIN_CONTENT_TEXT = __29(
+import { __ as __30 } from "@wordpress/i18n";
+var ADMIN_TITLE_TEXT = __30("Enable Unfiltered Uploads", "elementor");
+var ADMIN_CONTENT_TEXT = __30(
   "Before you enable unfiltered files upload, note that such files include a security risk. Elementor does run a process to remove possible malicious code, but there is still risk involved when using such files.",
   "elementor"
 );
-var ADMIN_FAILED_CONTENT_TEXT_PT1 = __29("Failed to enable unfiltered files upload.", "elementor");
-var ADMIN_FAILED_CONTENT_TEXT_PT2 = __29(
+var ADMIN_FAILED_CONTENT_TEXT_PT1 = __30("Failed to enable unfiltered files upload.", "elementor");
+var ADMIN_FAILED_CONTENT_TEXT_PT2 = __30(
   "You can try again, if the problem persists, please contact support.",
   "elementor"
 );
@@ -5014,9 +5132,9 @@ var EnableUnfilteredModal = (props) => {
     }
   };
   const dialogProps = { ...props, isPending, handleEnable, isError, onClose };
-  return /* @__PURE__ */ React77.createElement(AdminDialog, { ...dialogProps });
+  return /* @__PURE__ */ React79.createElement(AdminDialog, { ...dialogProps });
 };
-var AdminDialog = ({ open, onClose, handleEnable, isPending, isError }) => /* @__PURE__ */ React77.createElement(Dialog, { open, maxWidth: "sm", onClose: () => onClose(false) }, /* @__PURE__ */ React77.createElement(DialogHeader, { logo: false }, /* @__PURE__ */ React77.createElement(DialogTitle, null, ADMIN_TITLE_TEXT)), /* @__PURE__ */ React77.createElement(Divider3, null), /* @__PURE__ */ React77.createElement(DialogContent, null, /* @__PURE__ */ React77.createElement(DialogContentText, null, isError ? /* @__PURE__ */ React77.createElement(React77.Fragment, null, ADMIN_FAILED_CONTENT_TEXT_PT1, " ", /* @__PURE__ */ React77.createElement("br", null), " ", ADMIN_FAILED_CONTENT_TEXT_PT2) : ADMIN_CONTENT_TEXT)), /* @__PURE__ */ React77.createElement(DialogActions, null, /* @__PURE__ */ React77.createElement(Button4, { size: "medium", color: "secondary", onClick: () => onClose(false) }, __29("Cancel", "elementor")), /* @__PURE__ */ React77.createElement(
+var AdminDialog = ({ open, onClose, handleEnable, isPending, isError }) => /* @__PURE__ */ React79.createElement(Dialog, { open, maxWidth: "sm", onClose: () => onClose(false) }, /* @__PURE__ */ React79.createElement(DialogHeader, { logo: false }, /* @__PURE__ */ React79.createElement(DialogTitle, null, ADMIN_TITLE_TEXT)), /* @__PURE__ */ React79.createElement(Divider3, null), /* @__PURE__ */ React79.createElement(DialogContent, null, /* @__PURE__ */ React79.createElement(DialogContentText, null, isError ? /* @__PURE__ */ React79.createElement(React79.Fragment, null, ADMIN_FAILED_CONTENT_TEXT_PT1, " ", /* @__PURE__ */ React79.createElement("br", null), " ", ADMIN_FAILED_CONTENT_TEXT_PT2) : ADMIN_CONTENT_TEXT)), /* @__PURE__ */ React79.createElement(DialogActions, null, /* @__PURE__ */ React79.createElement(Button4, { size: "medium", color: "secondary", onClick: () => onClose(false) }, __30("Cancel", "elementor")), /* @__PURE__ */ React79.createElement(
   Button4,
   {
     size: "medium",
@@ -5025,7 +5143,7 @@ var AdminDialog = ({ open, onClose, handleEnable, isPending, isError }) => /* @_
     color: "primary",
     disabled: isPending
   },
-  isPending ? /* @__PURE__ */ React77.createElement(CircularProgress2, { size: 24 }) : __29("Enable", "elementor")
+  isPending ? /* @__PURE__ */ React79.createElement(CircularProgress2, { size: 24 }) : __30("Enable", "elementor")
 )));
 
 // src/controls/svg-media-control.tsx
@@ -5090,19 +5208,19 @@ var SvgMediaControl = createControl(() => {
     }
   };
   const infotipProps = {
-    title: __30("Sorry, you can't upload that file yet.", "elementor"),
-    description: /* @__PURE__ */ React78.createElement(React78.Fragment, null, __30("To upload them anyway, ask the site administrator to enable unfiltered", "elementor"), /* @__PURE__ */ React78.createElement("br", null), __30("file uploads.", "elementor")),
+    title: __31("Sorry, you can't upload that file yet.", "elementor"),
+    description: /* @__PURE__ */ React80.createElement(React80.Fragment, null, __31("To upload them anyway, ask the site administrator to enable unfiltered", "elementor"), /* @__PURE__ */ React80.createElement("br", null), __31("file uploads.", "elementor")),
     isEnabled: !isAdmin
   };
-  return /* @__PURE__ */ React78.createElement(Stack13, { gap: 1, "aria-label": "SVG Control" }, /* @__PURE__ */ React78.createElement(EnableUnfilteredModal, { open: unfilteredModalOpenState, onClose: onCloseUnfilteredModal }), /* @__PURE__ */ React78.createElement(ControlActions, null, /* @__PURE__ */ React78.createElement(StyledCard, { variant: "outlined" }, /* @__PURE__ */ React78.createElement(StyledCardMediaContainer, null, isFetching ? /* @__PURE__ */ React78.createElement(CircularProgress3, { role: "progressbar" }) : /* @__PURE__ */ React78.createElement(
+  return /* @__PURE__ */ React80.createElement(Stack13, { gap: 1, "aria-label": "SVG Control" }, /* @__PURE__ */ React80.createElement(EnableUnfilteredModal, { open: unfilteredModalOpenState, onClose: onCloseUnfilteredModal }), /* @__PURE__ */ React80.createElement(ControlActions, null, /* @__PURE__ */ React80.createElement(StyledCard, { variant: "outlined" }, /* @__PURE__ */ React80.createElement(StyledCardMediaContainer, null, isFetching ? /* @__PURE__ */ React80.createElement(CircularProgress3, { role: "progressbar" }) : /* @__PURE__ */ React80.createElement(
     CardMedia2,
     {
       component: "img",
       image: src,
-      alt: __30("Preview SVG", "elementor"),
+      alt: __31("Preview SVG", "elementor"),
       sx: { maxHeight: "140px", width: "50px" }
     }
-  )), /* @__PURE__ */ React78.createElement(
+  )), /* @__PURE__ */ React80.createElement(
     CardOverlay2,
     {
       sx: {
@@ -5111,7 +5229,7 @@ var SvgMediaControl = createControl(() => {
         }
       }
     },
-    /* @__PURE__ */ React78.createElement(Stack13, { gap: 1 }, /* @__PURE__ */ React78.createElement(
+    /* @__PURE__ */ React80.createElement(Stack13, { gap: 1 }, /* @__PURE__ */ React80.createElement(
       Button5,
       {
         size: "tiny",
@@ -5120,30 +5238,30 @@ var SvgMediaControl = createControl(() => {
         onClick: () => handleClick(MODE_BROWSE),
         "aria-label": "Select SVG"
       },
-      __30("Select SVG", "elementor")
-    ), /* @__PURE__ */ React78.createElement(ConditionalControlInfotip, { ...infotipProps }, /* @__PURE__ */ React78.createElement("span", null, /* @__PURE__ */ React78.createElement(ThemeProvider, { colorScheme: isAdmin ? "light" : "dark" }, /* @__PURE__ */ React78.createElement(
+      __31("Select SVG", "elementor")
+    ), /* @__PURE__ */ React80.createElement(ConditionalControlInfotip, { ...infotipProps }, /* @__PURE__ */ React80.createElement("span", null, /* @__PURE__ */ React80.createElement(ThemeProvider, { colorScheme: isAdmin ? "light" : "dark" }, /* @__PURE__ */ React80.createElement(
       Button5,
       {
         size: "tiny",
         variant: "text",
         color: "inherit",
-        startIcon: /* @__PURE__ */ React78.createElement(UploadIcon2, null),
+        startIcon: /* @__PURE__ */ React80.createElement(UploadIcon2, null),
         disabled: !isAdmin,
         onClick: () => isAdmin && handleClick(MODE_UPLOAD),
         "aria-label": "Upload SVG"
       },
-      __30("Upload", "elementor")
+      __31("Upload", "elementor")
     )))))
   ))));
 });
 
 // src/controls/video-media-control.tsx
-import * as React79 from "react";
+import * as React81 from "react";
 import { videoSrcPropTypeUtil } from "@elementor/editor-props";
 import { UploadIcon as UploadIcon3 } from "@elementor/icons";
 import { Button as Button6, Card as Card3, CardMedia as CardMedia3, CardOverlay as CardOverlay3, CircularProgress as CircularProgress4, Stack as Stack14 } from "@elementor/ui";
 import { useWpMediaAttachment as useWpMediaAttachment3, useWpMediaFrame as useWpMediaFrame3 } from "@elementor/wp-media";
-import { __ as __31 } from "@wordpress/i18n";
+import { __ as __32 } from "@wordpress/i18n";
 var PLACEHOLDER_IMAGE = window.elementorCommon?.config?.urls?.assets + "/shapes/play-triangle.svg";
 var VideoMediaControl = createControl(() => {
   const { value, setValue } = useBoundProp(videoSrcPropTypeUtil);
@@ -5164,7 +5282,7 @@ var VideoMediaControl = createControl(() => {
       });
     }
   });
-  return /* @__PURE__ */ React79.createElement(ControlActions, null, /* @__PURE__ */ React79.createElement(Card3, { variant: "outlined" }, /* @__PURE__ */ React79.createElement(
+  return /* @__PURE__ */ React81.createElement(ControlActions, null, /* @__PURE__ */ React81.createElement(Card3, { variant: "outlined" }, /* @__PURE__ */ React81.createElement(
     CardMedia3,
     {
       sx: {
@@ -5179,8 +5297,8 @@ var VideoMediaControl = createControl(() => {
         alignItems: "center"
       }
     },
-    /* @__PURE__ */ React79.createElement(VideoPreview, { isFetching, videoUrl })
-  ), /* @__PURE__ */ React79.createElement(CardOverlay3, null, /* @__PURE__ */ React79.createElement(Stack14, { gap: 1 }, /* @__PURE__ */ React79.createElement(
+    /* @__PURE__ */ React81.createElement(VideoPreview, { isFetching, videoUrl })
+  ), /* @__PURE__ */ React81.createElement(CardOverlay3, null, /* @__PURE__ */ React81.createElement(Stack14, { gap: 1 }, /* @__PURE__ */ React81.createElement(
     Button6,
     {
       size: "tiny",
@@ -5188,25 +5306,25 @@ var VideoMediaControl = createControl(() => {
       variant: "outlined",
       onClick: () => open({ mode: "browse" })
     },
-    __31("Select video", "elementor")
-  ), /* @__PURE__ */ React79.createElement(
+    __32("Select video", "elementor")
+  ), /* @__PURE__ */ React81.createElement(
     Button6,
     {
       size: "tiny",
       variant: "text",
       color: "inherit",
-      startIcon: /* @__PURE__ */ React79.createElement(UploadIcon3, null),
+      startIcon: /* @__PURE__ */ React81.createElement(UploadIcon3, null),
       onClick: () => open({ mode: "upload" })
     },
-    __31("Upload", "elementor")
+    __32("Upload", "elementor")
   )))));
 });
 var VideoPreview = ({ isFetching = false, videoUrl }) => {
   if (isFetching) {
-    return /* @__PURE__ */ React79.createElement(CircularProgress4, null);
+    return /* @__PURE__ */ React81.createElement(CircularProgress4, null);
   }
   if (videoUrl) {
-    return /* @__PURE__ */ React79.createElement(
+    return /* @__PURE__ */ React81.createElement(
       "video",
       {
         src: videoUrl,
@@ -5221,17 +5339,17 @@ var VideoPreview = ({ isFetching = false, videoUrl }) => {
       }
     );
   }
-  return /* @__PURE__ */ React79.createElement("img", { src: PLACEHOLDER_IMAGE, alt: "No video selected" });
+  return /* @__PURE__ */ React81.createElement("img", { src: PLACEHOLDER_IMAGE, alt: "No video selected" });
 };
 
 // src/controls/background-control/background-control.tsx
-import * as React86 from "react";
+import * as React88 from "react";
 import { backgroundPropTypeUtil } from "@elementor/editor-props";
 import { Grid as Grid17 } from "@elementor/ui";
-import { __ as __37 } from "@wordpress/i18n";
+import { __ as __38 } from "@wordpress/i18n";
 
 // src/controls/background-control/background-overlay/background-overlay-repeater-control.tsx
-import * as React85 from "react";
+import * as React87 from "react";
 import {
   backgroundColorOverlayPropTypeUtil as backgroundColorOverlayPropTypeUtil2,
   backgroundImageOverlayPropTypeUtil as backgroundImageOverlayPropTypeUtil2,
@@ -5240,21 +5358,21 @@ import {
 } from "@elementor/editor-props";
 import { Box as Box14, CardMedia as CardMedia4, styled as styled10, Tab, TabPanel, Tabs, UnstableColorIndicator as UnstableColorIndicator3 } from "@elementor/ui";
 import { useWpMediaAttachment as useWpMediaAttachment4 } from "@elementor/wp-media";
-import { __ as __36 } from "@wordpress/i18n";
+import { __ as __37 } from "@wordpress/i18n";
 
 // src/env.ts
 import { parseEnv } from "@elementor/env";
 var { env } = parseEnv("@elementor/editor-controls");
 
 // src/controls/background-control/background-gradient-color-control.tsx
-import * as React80 from "react";
+import * as React82 from "react";
 import {
   backgroundGradientOverlayPropTypeUtil,
   colorPropTypeUtil as colorPropTypeUtil2,
   colorStopPropTypeUtil,
   gradientColorStopPropTypeUtil,
-  numberPropTypeUtil as numberPropTypeUtil3,
-  stringPropTypeUtil as stringPropTypeUtil12
+  numberPropTypeUtil as numberPropTypeUtil5,
+  stringPropTypeUtil as stringPropTypeUtil14
 } from "@elementor/editor-props";
 import { UnstableGradientBox } from "@elementor/ui";
 var BackgroundGradientColorControl = createControl(() => {
@@ -5262,19 +5380,19 @@ var BackgroundGradientColorControl = createControl(() => {
   const handleChange = (newValue) => {
     const transformedValue = createTransformableValue(newValue);
     if (transformedValue.positions) {
-      transformedValue.positions = stringPropTypeUtil12.create(newValue.positions.join(" "));
+      transformedValue.positions = stringPropTypeUtil14.create(newValue.positions.join(" "));
     }
     setValue(transformedValue);
   };
   const createTransformableValue = (newValue) => ({
     ...newValue,
-    type: stringPropTypeUtil12.create(newValue.type),
-    angle: numberPropTypeUtil3.create(newValue.angle),
+    type: stringPropTypeUtil14.create(newValue.type),
+    angle: numberPropTypeUtil5.create(newValue.angle),
     stops: gradientColorStopPropTypeUtil.create(
       newValue.stops.map(
         ({ color, offset }) => colorStopPropTypeUtil.create({
           color: colorPropTypeUtil2.create(color),
-          offset: numberPropTypeUtil3.create(offset)
+          offset: numberPropTypeUtil5.create(offset)
         })
       )
     )
@@ -5294,7 +5412,7 @@ var BackgroundGradientColorControl = createControl(() => {
       positions: positions?.value.split(" ")
     };
   };
-  return /* @__PURE__ */ React80.createElement(
+  return /* @__PURE__ */ React82.createElement(
     UnstableGradientBox,
     {
       sx: { width: "auto", padding: 1.5 },
@@ -5304,66 +5422,66 @@ var BackgroundGradientColorControl = createControl(() => {
   );
 });
 var initialBackgroundGradientOverlay = backgroundGradientOverlayPropTypeUtil.create({
-  type: stringPropTypeUtil12.create("linear"),
-  angle: numberPropTypeUtil3.create(180),
+  type: stringPropTypeUtil14.create("linear"),
+  angle: numberPropTypeUtil5.create(180),
   stops: gradientColorStopPropTypeUtil.create([
     colorStopPropTypeUtil.create({
       color: colorPropTypeUtil2.create("rgb(0,0,0)"),
-      offset: numberPropTypeUtil3.create(0)
+      offset: numberPropTypeUtil5.create(0)
     }),
     colorStopPropTypeUtil.create({
       color: colorPropTypeUtil2.create("rgb(255,255,255)"),
-      offset: numberPropTypeUtil3.create(100)
+      offset: numberPropTypeUtil5.create(100)
     })
   ])
 });
 
 // src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-attachment.tsx
-import * as React81 from "react";
+import * as React83 from "react";
 import { PinIcon, PinnedOffIcon } from "@elementor/icons";
 import { Grid as Grid13 } from "@elementor/ui";
-import { __ as __32 } from "@wordpress/i18n";
+import { __ as __33 } from "@wordpress/i18n";
 var attachmentControlOptions = [
   {
     value: "fixed",
-    label: __32("Fixed", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React81.createElement(PinIcon, { fontSize: size }),
+    label: __33("Fixed", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React83.createElement(PinIcon, { fontSize: size }),
     showTooltip: true
   },
   {
     value: "scroll",
-    label: __32("Scroll", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React81.createElement(PinnedOffIcon, { fontSize: size }),
+    label: __33("Scroll", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React83.createElement(PinnedOffIcon, { fontSize: size }),
     showTooltip: true
   }
 ];
 var BackgroundImageOverlayAttachment = () => {
-  return /* @__PURE__ */ React81.createElement(PopoverGridContainer, null, /* @__PURE__ */ React81.createElement(Grid13, { item: true, xs: 6 }, /* @__PURE__ */ React81.createElement(ControlFormLabel, null, __32("Attachment", "elementor"))), /* @__PURE__ */ React81.createElement(Grid13, { item: true, xs: 6, sx: { display: "flex", justifyContent: "flex-end", overflow: "hidden" } }, /* @__PURE__ */ React81.createElement(ToggleControl, { options: attachmentControlOptions })));
+  return /* @__PURE__ */ React83.createElement(PopoverGridContainer, null, /* @__PURE__ */ React83.createElement(Grid13, { item: true, xs: 6 }, /* @__PURE__ */ React83.createElement(ControlFormLabel, null, __33("Attachment", "elementor"))), /* @__PURE__ */ React83.createElement(Grid13, { item: true, xs: 6, sx: { display: "flex", justifyContent: "flex-end", overflow: "hidden" } }, /* @__PURE__ */ React83.createElement(ToggleControl, { options: attachmentControlOptions })));
 };
 
 // src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-position.tsx
-import * as React82 from "react";
+import * as React84 from "react";
 import { useRef as useRef14 } from "react";
-import { backgroundImagePositionOffsetPropTypeUtil, stringPropTypeUtil as stringPropTypeUtil13 } from "@elementor/editor-props";
+import { backgroundImagePositionOffsetPropTypeUtil, stringPropTypeUtil as stringPropTypeUtil15 } from "@elementor/editor-props";
 import { MenuListItem as MenuListItem6 } from "@elementor/editor-ui";
 import { LetterXIcon, LetterYIcon } from "@elementor/icons";
 import { Grid as Grid14, Select as Select4 } from "@elementor/ui";
-import { __ as __33 } from "@wordpress/i18n";
+import { __ as __34 } from "@wordpress/i18n";
 var backgroundPositionOptions = [
-  { label: __33("Center center", "elementor"), value: "center center" },
-  { label: __33("Center left", "elementor"), value: "center left" },
-  { label: __33("Center right", "elementor"), value: "center right" },
-  { label: __33("Top center", "elementor"), value: "top center" },
-  { label: __33("Top left", "elementor"), value: "top left" },
-  { label: __33("Top right", "elementor"), value: "top right" },
-  { label: __33("Bottom center", "elementor"), value: "bottom center" },
-  { label: __33("Bottom left", "elementor"), value: "bottom left" },
-  { label: __33("Bottom right", "elementor"), value: "bottom right" },
-  { label: __33("Custom", "elementor"), value: "custom" }
+  { label: __34("Center center", "elementor"), value: "center center" },
+  { label: __34("Center left", "elementor"), value: "center left" },
+  { label: __34("Center right", "elementor"), value: "center right" },
+  { label: __34("Top center", "elementor"), value: "top center" },
+  { label: __34("Top left", "elementor"), value: "top left" },
+  { label: __34("Top right", "elementor"), value: "top right" },
+  { label: __34("Bottom center", "elementor"), value: "bottom center" },
+  { label: __34("Bottom left", "elementor"), value: "bottom left" },
+  { label: __34("Bottom right", "elementor"), value: "bottom right" },
+  { label: __34("Custom", "elementor"), value: "custom" }
 ];
 var BackgroundImageOverlayPosition = () => {
   const backgroundImageOffsetContext = useBoundProp(backgroundImagePositionOffsetPropTypeUtil);
-  const stringPropContext = useBoundProp(stringPropTypeUtil13);
+  const stringPropContext = useBoundProp(stringPropTypeUtil15);
   const isCustom = !!backgroundImageOffsetContext.value;
   const rowRef = useRef14(null);
   const handlePositionChange = (event) => {
@@ -5374,7 +5492,7 @@ var BackgroundImageOverlayPosition = () => {
       stringPropContext.setValue(value);
     }
   };
-  return /* @__PURE__ */ React82.createElement(Grid14, { container: true, spacing: 1.5 }, /* @__PURE__ */ React82.createElement(Grid14, { item: true, xs: 12 }, /* @__PURE__ */ React82.createElement(PopoverGridContainer, null, /* @__PURE__ */ React82.createElement(Grid14, { item: true, xs: 6 }, /* @__PURE__ */ React82.createElement(ControlFormLabel, null, __33("Position", "elementor"))), /* @__PURE__ */ React82.createElement(Grid14, { item: true, xs: 6, sx: { display: "flex", justifyContent: "flex-end", overflow: "hidden" } }, /* @__PURE__ */ React82.createElement(ControlActions, null, /* @__PURE__ */ React82.createElement(
+  return /* @__PURE__ */ React84.createElement(Grid14, { container: true, spacing: 1.5 }, /* @__PURE__ */ React84.createElement(Grid14, { item: true, xs: 12 }, /* @__PURE__ */ React84.createElement(PopoverGridContainer, null, /* @__PURE__ */ React84.createElement(Grid14, { item: true, xs: 6 }, /* @__PURE__ */ React84.createElement(ControlFormLabel, null, __34("Position", "elementor"))), /* @__PURE__ */ React84.createElement(Grid14, { item: true, xs: 6, sx: { display: "flex", justifyContent: "flex-end", overflow: "hidden" } }, /* @__PURE__ */ React84.createElement(ControlActions, null, /* @__PURE__ */ React84.createElement(
     Select4,
     {
       fullWidth: true,
@@ -5383,18 +5501,18 @@ var BackgroundImageOverlayPosition = () => {
       disabled: stringPropContext.disabled,
       value: (backgroundImageOffsetContext.value ? "custom" : stringPropContext.value) ?? ""
     },
-    backgroundPositionOptions.map(({ label, value }) => /* @__PURE__ */ React82.createElement(MenuListItem6, { key: value, value: value ?? "" }, label))
-  ))))), isCustom ? /* @__PURE__ */ React82.createElement(PropProvider, { ...backgroundImageOffsetContext }, /* @__PURE__ */ React82.createElement(Grid14, { item: true, xs: 12 }, /* @__PURE__ */ React82.createElement(Grid14, { container: true, spacing: 1.5, ref: rowRef }, /* @__PURE__ */ React82.createElement(Grid14, { item: true, xs: 6 }, /* @__PURE__ */ React82.createElement(PropKeyProvider, { bind: "x" }, /* @__PURE__ */ React82.createElement(
+    backgroundPositionOptions.map(({ label, value }) => /* @__PURE__ */ React84.createElement(MenuListItem6, { key: value, value: value ?? "" }, label))
+  ))))), isCustom ? /* @__PURE__ */ React84.createElement(PropProvider, { ...backgroundImageOffsetContext }, /* @__PURE__ */ React84.createElement(Grid14, { item: true, xs: 12 }, /* @__PURE__ */ React84.createElement(Grid14, { container: true, spacing: 1.5, ref: rowRef }, /* @__PURE__ */ React84.createElement(Grid14, { item: true, xs: 6 }, /* @__PURE__ */ React84.createElement(PropKeyProvider, { bind: "x" }, /* @__PURE__ */ React84.createElement(
     SizeControl,
     {
-      startIcon: /* @__PURE__ */ React82.createElement(LetterXIcon, { fontSize: "tiny" }),
+      startIcon: /* @__PURE__ */ React84.createElement(LetterXIcon, { fontSize: "tiny" }),
       anchorRef: rowRef,
       min: -Number.MAX_SAFE_INTEGER
     }
-  ))), /* @__PURE__ */ React82.createElement(Grid14, { item: true, xs: 6 }, /* @__PURE__ */ React82.createElement(PropKeyProvider, { bind: "y" }, /* @__PURE__ */ React82.createElement(
+  ))), /* @__PURE__ */ React84.createElement(Grid14, { item: true, xs: 6 }, /* @__PURE__ */ React84.createElement(PropKeyProvider, { bind: "y" }, /* @__PURE__ */ React84.createElement(
     SizeControl,
     {
-      startIcon: /* @__PURE__ */ React82.createElement(LetterYIcon, { fontSize: "tiny" }),
+      startIcon: /* @__PURE__ */ React84.createElement(LetterYIcon, { fontSize: "tiny" }),
       anchorRef: rowRef,
       min: -Number.MAX_SAFE_INTEGER
     }
@@ -5402,44 +5520,44 @@ var BackgroundImageOverlayPosition = () => {
 };
 
 // src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-repeat.tsx
-import * as React83 from "react";
+import * as React85 from "react";
 import { DotsHorizontalIcon, DotsVerticalIcon, GridDotsIcon, XIcon as XIcon3 } from "@elementor/icons";
 import { Grid as Grid15 } from "@elementor/ui";
-import { __ as __34 } from "@wordpress/i18n";
+import { __ as __35 } from "@wordpress/i18n";
 var repeatControlOptions = [
   {
     value: "repeat",
-    label: __34("Repeat", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React83.createElement(GridDotsIcon, { fontSize: size }),
+    label: __35("Repeat", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React85.createElement(GridDotsIcon, { fontSize: size }),
     showTooltip: true
   },
   {
     value: "repeat-x",
-    label: __34("Repeat-x", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React83.createElement(DotsHorizontalIcon, { fontSize: size }),
+    label: __35("Repeat-x", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React85.createElement(DotsHorizontalIcon, { fontSize: size }),
     showTooltip: true
   },
   {
     value: "repeat-y",
-    label: __34("Repeat-y", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React83.createElement(DotsVerticalIcon, { fontSize: size }),
+    label: __35("Repeat-y", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React85.createElement(DotsVerticalIcon, { fontSize: size }),
     showTooltip: true
   },
   {
     value: "no-repeat",
-    label: __34("No-repeat", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React83.createElement(XIcon3, { fontSize: size }),
+    label: __35("No-repeat", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React85.createElement(XIcon3, { fontSize: size }),
     showTooltip: true
   }
 ];
 var BackgroundImageOverlayRepeat = () => {
-  return /* @__PURE__ */ React83.createElement(PopoverGridContainer, null, /* @__PURE__ */ React83.createElement(Grid15, { item: true, xs: 6 }, /* @__PURE__ */ React83.createElement(ControlFormLabel, null, __34("Repeat", "elementor"))), /* @__PURE__ */ React83.createElement(Grid15, { item: true, xs: 6, sx: { display: "flex", justifyContent: "flex-end" } }, /* @__PURE__ */ React83.createElement(ToggleControl, { options: repeatControlOptions })));
+  return /* @__PURE__ */ React85.createElement(PopoverGridContainer, null, /* @__PURE__ */ React85.createElement(Grid15, { item: true, xs: 6 }, /* @__PURE__ */ React85.createElement(ControlFormLabel, null, __35("Repeat", "elementor"))), /* @__PURE__ */ React85.createElement(Grid15, { item: true, xs: 6, sx: { display: "flex", justifyContent: "flex-end" } }, /* @__PURE__ */ React85.createElement(ToggleControl, { options: repeatControlOptions })));
 };
 
 // src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-size.tsx
-import * as React84 from "react";
+import * as React86 from "react";
 import { useRef as useRef15 } from "react";
-import { backgroundImageSizeScalePropTypeUtil, stringPropTypeUtil as stringPropTypeUtil14 } from "@elementor/editor-props";
+import { backgroundImageSizeScalePropTypeUtil, stringPropTypeUtil as stringPropTypeUtil16 } from "@elementor/editor-props";
 import {
   ArrowBarBothIcon,
   ArrowsMaximizeIcon,
@@ -5449,36 +5567,36 @@ import {
   PencilIcon
 } from "@elementor/icons";
 import { Grid as Grid16 } from "@elementor/ui";
-import { __ as __35 } from "@wordpress/i18n";
+import { __ as __36 } from "@wordpress/i18n";
 var sizeControlOptions = [
   {
     value: "auto",
-    label: __35("Auto", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React84.createElement(LetterAIcon, { fontSize: size }),
+    label: __36("Auto", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React86.createElement(LetterAIcon, { fontSize: size }),
     showTooltip: true
   },
   {
     value: "cover",
-    label: __35("Cover", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React84.createElement(ArrowsMaximizeIcon, { fontSize: size }),
+    label: __36("Cover", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React86.createElement(ArrowsMaximizeIcon, { fontSize: size }),
     showTooltip: true
   },
   {
     value: "contain",
-    label: __35("Contain", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React84.createElement(ArrowBarBothIcon, { fontSize: size }),
+    label: __36("Contain", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React86.createElement(ArrowBarBothIcon, { fontSize: size }),
     showTooltip: true
   },
   {
     value: "custom",
-    label: __35("Custom", "elementor"),
-    renderContent: ({ size }) => /* @__PURE__ */ React84.createElement(PencilIcon, { fontSize: size }),
+    label: __36("Custom", "elementor"),
+    renderContent: ({ size }) => /* @__PURE__ */ React86.createElement(PencilIcon, { fontSize: size }),
     showTooltip: true
   }
 ];
 var BackgroundImageOverlaySize = () => {
   const backgroundImageScaleContext = useBoundProp(backgroundImageSizeScalePropTypeUtil);
-  const stringPropContext = useBoundProp(stringPropTypeUtil14);
+  const stringPropContext = useBoundProp(stringPropTypeUtil16);
   const isCustom = !!backgroundImageScaleContext.value;
   const rowRef = useRef15(null);
   const handleSizeChange = (size) => {
@@ -5488,7 +5606,7 @@ var BackgroundImageOverlaySize = () => {
       stringPropContext.setValue(size);
     }
   };
-  return /* @__PURE__ */ React84.createElement(Grid16, { container: true, spacing: 1.5 }, /* @__PURE__ */ React84.createElement(Grid16, { item: true, xs: 12 }, /* @__PURE__ */ React84.createElement(PopoverGridContainer, null, /* @__PURE__ */ React84.createElement(Grid16, { item: true, xs: 6 }, /* @__PURE__ */ React84.createElement(ControlFormLabel, null, __35("Size", "elementor"))), /* @__PURE__ */ React84.createElement(Grid16, { item: true, xs: 6, sx: { display: "flex", justifyContent: "flex-end" } }, /* @__PURE__ */ React84.createElement(
+  return /* @__PURE__ */ React86.createElement(Grid16, { container: true, spacing: 1.5 }, /* @__PURE__ */ React86.createElement(Grid16, { item: true, xs: 12 }, /* @__PURE__ */ React86.createElement(PopoverGridContainer, null, /* @__PURE__ */ React86.createElement(Grid16, { item: true, xs: 6 }, /* @__PURE__ */ React86.createElement(ControlFormLabel, null, __36("Size", "elementor"))), /* @__PURE__ */ React86.createElement(Grid16, { item: true, xs: 6, sx: { display: "flex", justifyContent: "flex-end" } }, /* @__PURE__ */ React86.createElement(
     ControlToggleButtonGroup,
     {
       exclusive: true,
@@ -5497,17 +5615,17 @@ var BackgroundImageOverlaySize = () => {
       disabled: stringPropContext.disabled,
       value: backgroundImageScaleContext.value ? "custom" : stringPropContext.value
     }
-  )))), isCustom ? /* @__PURE__ */ React84.createElement(PropProvider, { ...backgroundImageScaleContext }, /* @__PURE__ */ React84.createElement(Grid16, { item: true, xs: 12, ref: rowRef }, /* @__PURE__ */ React84.createElement(PopoverGridContainer, null, /* @__PURE__ */ React84.createElement(Grid16, { item: true, xs: 6 }, /* @__PURE__ */ React84.createElement(PropKeyProvider, { bind: "width" }, /* @__PURE__ */ React84.createElement(
+  )))), isCustom ? /* @__PURE__ */ React86.createElement(PropProvider, { ...backgroundImageScaleContext }, /* @__PURE__ */ React86.createElement(Grid16, { item: true, xs: 12, ref: rowRef }, /* @__PURE__ */ React86.createElement(PopoverGridContainer, null, /* @__PURE__ */ React86.createElement(Grid16, { item: true, xs: 6 }, /* @__PURE__ */ React86.createElement(PropKeyProvider, { bind: "width" }, /* @__PURE__ */ React86.createElement(
     SizeControl,
     {
-      startIcon: /* @__PURE__ */ React84.createElement(ArrowsMoveHorizontalIcon2, { fontSize: "tiny" }),
+      startIcon: /* @__PURE__ */ React86.createElement(ArrowsMoveHorizontalIcon2, { fontSize: "tiny" }),
       extendedOptions: ["auto"],
       anchorRef: rowRef
     }
-  ))), /* @__PURE__ */ React84.createElement(Grid16, { item: true, xs: 6 }, /* @__PURE__ */ React84.createElement(PropKeyProvider, { bind: "height" }, /* @__PURE__ */ React84.createElement(
+  ))), /* @__PURE__ */ React86.createElement(Grid16, { item: true, xs: 6 }, /* @__PURE__ */ React86.createElement(PropKeyProvider, { bind: "height" }, /* @__PURE__ */ React86.createElement(
     SizeControl,
     {
-      startIcon: /* @__PURE__ */ React84.createElement(ArrowsMoveVerticalIcon2, { fontSize: "tiny" }),
+      startIcon: /* @__PURE__ */ React86.createElement(ArrowsMoveVerticalIcon2, { fontSize: "tiny" }),
       extendedOptions: ["auto"],
       anchorRef: rowRef
     }
@@ -5608,29 +5726,29 @@ var getInitialBackgroundOverlay = () => ({
   }
 });
 var backgroundResolutionOptions = [
-  { label: __36("Thumbnail - 150 x 150", "elementor"), value: "thumbnail" },
-  { label: __36("Medium - 300 x 300", "elementor"), value: "medium" },
-  { label: __36("Large 1024 x 1024", "elementor"), value: "large" },
-  { label: __36("Full", "elementor"), value: "full" }
+  { label: __37("Thumbnail - 150 x 150", "elementor"), value: "thumbnail" },
+  { label: __37("Medium - 300 x 300", "elementor"), value: "medium" },
+  { label: __37("Large 1024 x 1024", "elementor"), value: "large" },
+  { label: __37("Full", "elementor"), value: "full" }
 ];
 var BackgroundOverlayRepeaterControl = createControl(() => {
   const { propType, value: overlayValues, setValue } = useBoundProp(backgroundOverlayPropTypeUtil);
-  return /* @__PURE__ */ React85.createElement(PropProvider, { propType, value: overlayValues, setValue }, /* @__PURE__ */ React85.createElement(
+  return /* @__PURE__ */ React87.createElement(PropProvider, { propType, value: overlayValues, setValue }, /* @__PURE__ */ React87.createElement(
     ControlRepeater,
     {
       initial: getInitialBackgroundOverlay(),
       propTypeUtil: backgroundOverlayPropTypeUtil
     },
-    /* @__PURE__ */ React85.createElement(RepeaterHeader, { label: __36("Overlay", "elementor") }, /* @__PURE__ */ React85.createElement(TooltipAddItemAction, { newItemIndex: 0 })),
-    /* @__PURE__ */ React85.createElement(ItemsContainer, null, /* @__PURE__ */ React85.createElement(
+    /* @__PURE__ */ React87.createElement(RepeaterHeader, { label: __37("Overlay", "elementor") }, /* @__PURE__ */ React87.createElement(TooltipAddItemAction, { newItemIndex: 0 })),
+    /* @__PURE__ */ React87.createElement(ItemsContainer, null, /* @__PURE__ */ React87.createElement(
       Item,
       {
         Icon: ItemIcon2,
         Label: ItemLabel2,
-        actions: /* @__PURE__ */ React85.createElement(React85.Fragment, null, /* @__PURE__ */ React85.createElement(DuplicateItemAction, null), /* @__PURE__ */ React85.createElement(DisableItemAction, null), /* @__PURE__ */ React85.createElement(RemoveItemAction, null))
+        actions: /* @__PURE__ */ React87.createElement(React87.Fragment, null, /* @__PURE__ */ React87.createElement(DuplicateItemAction, null), /* @__PURE__ */ React87.createElement(DisableItemAction, null), /* @__PURE__ */ React87.createElement(RemoveItemAction, null))
       }
     )),
-    /* @__PURE__ */ React85.createElement(EditItemPopover, null, /* @__PURE__ */ React85.createElement(ItemContent, null))
+    /* @__PURE__ */ React87.createElement(EditItemPopover, null, /* @__PURE__ */ React87.createElement(ItemContent, null))
   ));
 });
 var ItemContent = () => {
@@ -5640,27 +5758,27 @@ var ItemContent = () => {
     gradient: initialBackgroundGradientOverlay.value
   });
   const { rowRef } = useRepeaterContext();
-  return /* @__PURE__ */ React85.createElement(Box14, { sx: { width: "100%" } }, /* @__PURE__ */ React85.createElement(Box14, { sx: { borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React85.createElement(
+  return /* @__PURE__ */ React87.createElement(Box14, { sx: { width: "100%" } }, /* @__PURE__ */ React87.createElement(Box14, { sx: { borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React87.createElement(
     Tabs,
     {
       size: "small",
       variant: "fullWidth",
       ...getTabsProps(),
-      "aria-label": __36("Background Overlay", "elementor")
+      "aria-label": __37("Background Overlay", "elementor")
     },
-    /* @__PURE__ */ React85.createElement(Tab, { label: __36("Image", "elementor"), ...getTabProps("image") }),
-    /* @__PURE__ */ React85.createElement(Tab, { label: __36("Gradient", "elementor"), ...getTabProps("gradient") }),
-    /* @__PURE__ */ React85.createElement(Tab, { label: __36("Color", "elementor"), ...getTabProps("color") })
-  )), /* @__PURE__ */ React85.createElement(TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("image") }, /* @__PURE__ */ React85.createElement(PopoverContent, null, /* @__PURE__ */ React85.createElement(ImageOverlayContent, null))), /* @__PURE__ */ React85.createElement(TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("gradient") }, /* @__PURE__ */ React85.createElement(BackgroundGradientColorControl, null)), /* @__PURE__ */ React85.createElement(TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("color") }, /* @__PURE__ */ React85.createElement(PopoverContent, null, /* @__PURE__ */ React85.createElement(ColorOverlayContent, { anchorEl: rowRef }))));
+    /* @__PURE__ */ React87.createElement(Tab, { label: __37("Image", "elementor"), ...getTabProps("image") }),
+    /* @__PURE__ */ React87.createElement(Tab, { label: __37("Gradient", "elementor"), ...getTabProps("gradient") }),
+    /* @__PURE__ */ React87.createElement(Tab, { label: __37("Color", "elementor"), ...getTabProps("color") })
+  )), /* @__PURE__ */ React87.createElement(TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("image") }, /* @__PURE__ */ React87.createElement(PopoverContent, null, /* @__PURE__ */ React87.createElement(ImageOverlayContent, null))), /* @__PURE__ */ React87.createElement(TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("gradient") }, /* @__PURE__ */ React87.createElement(BackgroundGradientColorControl, null)), /* @__PURE__ */ React87.createElement(TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("color") }, /* @__PURE__ */ React87.createElement(PopoverContent, null, /* @__PURE__ */ React87.createElement(ColorOverlayContent, { anchorEl: rowRef }))));
 };
 var ItemIcon2 = ({ value }) => {
   switch (value.$$type) {
     case "background-image-overlay":
-      return /* @__PURE__ */ React85.createElement(ItemIconImage, { value });
+      return /* @__PURE__ */ React87.createElement(ItemIconImage, { value });
     case "background-color-overlay":
-      return /* @__PURE__ */ React85.createElement(ItemIconColor, { value });
+      return /* @__PURE__ */ React87.createElement(ItemIconColor, { value });
     case "background-gradient-overlay":
-      return /* @__PURE__ */ React85.createElement(ItemIconGradient, { value });
+      return /* @__PURE__ */ React87.createElement(ItemIconGradient, { value });
     default:
       return null;
   }
@@ -5673,11 +5791,11 @@ var extractColorFrom = (prop) => {
 };
 var ItemIconColor = ({ value: prop }) => {
   const color = extractColorFrom(prop);
-  return /* @__PURE__ */ React85.createElement(StyledUnstableColorIndicator3, { size: "inherit", component: "span", value: color });
+  return /* @__PURE__ */ React87.createElement(StyledUnstableColorIndicator3, { size: "inherit", component: "span", value: color });
 };
 var ItemIconImage = ({ value }) => {
   const { imageUrl } = useImage(value);
-  return /* @__PURE__ */ React85.createElement(
+  return /* @__PURE__ */ React87.createElement(
     CardMedia4,
     {
       image: imageUrl,
@@ -5692,41 +5810,41 @@ var ItemIconImage = ({ value }) => {
 };
 var ItemIconGradient = ({ value }) => {
   const gradient = getGradientValue(value);
-  return /* @__PURE__ */ React85.createElement(StyledUnstableColorIndicator3, { size: "inherit", component: "span", value: gradient });
+  return /* @__PURE__ */ React87.createElement(StyledUnstableColorIndicator3, { size: "inherit", component: "span", value: gradient });
 };
 var ItemLabel2 = ({ value }) => {
   switch (value.$$type) {
     case "background-image-overlay":
-      return /* @__PURE__ */ React85.createElement(ItemLabelImage, { value });
+      return /* @__PURE__ */ React87.createElement(ItemLabelImage, { value });
     case "background-color-overlay":
-      return /* @__PURE__ */ React85.createElement(ItemLabelColor, { value });
+      return /* @__PURE__ */ React87.createElement(ItemLabelColor, { value });
     case "background-gradient-overlay":
-      return /* @__PURE__ */ React85.createElement(ItemLabelGradient, { value });
+      return /* @__PURE__ */ React87.createElement(ItemLabelGradient, { value });
     default:
       return null;
   }
 };
 var ItemLabelColor = ({ value: prop }) => {
   const color = extractColorFrom(prop);
-  return /* @__PURE__ */ React85.createElement("span", null, color);
+  return /* @__PURE__ */ React87.createElement("span", null, color);
 };
 var ItemLabelImage = ({ value }) => {
   const { imageTitle } = useImage(value);
-  return /* @__PURE__ */ React85.createElement("span", null, imageTitle);
+  return /* @__PURE__ */ React87.createElement("span", null, imageTitle);
 };
 var ItemLabelGradient = ({ value }) => {
   if (value.value.type.value === "linear") {
-    return /* @__PURE__ */ React85.createElement("span", null, __36("Linear Gradient", "elementor"));
+    return /* @__PURE__ */ React87.createElement("span", null, __37("Linear Gradient", "elementor"));
   }
-  return /* @__PURE__ */ React85.createElement("span", null, __36("Radial Gradient", "elementor"));
+  return /* @__PURE__ */ React87.createElement("span", null, __37("Radial Gradient", "elementor"));
 };
 var ColorOverlayContent = ({ anchorEl }) => {
   const propContext = useBoundProp(backgroundColorOverlayPropTypeUtil2);
-  return /* @__PURE__ */ React85.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React85.createElement(PropKeyProvider, { bind: "color" }, /* @__PURE__ */ React85.createElement(ColorControl, { anchorEl })));
+  return /* @__PURE__ */ React87.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React87.createElement(PropKeyProvider, { bind: "color" }, /* @__PURE__ */ React87.createElement(ColorControl, { anchorEl })));
 };
 var ImageOverlayContent = () => {
   const propContext = useBoundProp(backgroundImageOverlayPropTypeUtil2);
-  return /* @__PURE__ */ React85.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React85.createElement(PropKeyProvider, { bind: "image" }, /* @__PURE__ */ React85.createElement(ImageControl, { sizes: backgroundResolutionOptions })), /* @__PURE__ */ React85.createElement(PropKeyProvider, { bind: "position" }, /* @__PURE__ */ React85.createElement(BackgroundImageOverlayPosition, null)), /* @__PURE__ */ React85.createElement(PropKeyProvider, { bind: "repeat" }, /* @__PURE__ */ React85.createElement(BackgroundImageOverlayRepeat, null)), /* @__PURE__ */ React85.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React85.createElement(BackgroundImageOverlaySize, null)), /* @__PURE__ */ React85.createElement(PropKeyProvider, { bind: "attachment" }, /* @__PURE__ */ React85.createElement(BackgroundImageOverlayAttachment, null)));
+  return /* @__PURE__ */ React87.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React87.createElement(PropKeyProvider, { bind: "image" }, /* @__PURE__ */ React87.createElement(ImageControl, { sizes: backgroundResolutionOptions })), /* @__PURE__ */ React87.createElement(PropKeyProvider, { bind: "position" }, /* @__PURE__ */ React87.createElement(BackgroundImageOverlayPosition, null)), /* @__PURE__ */ React87.createElement(PropKeyProvider, { bind: "repeat" }, /* @__PURE__ */ React87.createElement(BackgroundImageOverlayRepeat, null)), /* @__PURE__ */ React87.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React87.createElement(BackgroundImageOverlaySize, null)), /* @__PURE__ */ React87.createElement(PropKeyProvider, { bind: "attachment" }, /* @__PURE__ */ React87.createElement(BackgroundImageOverlayAttachment, null)));
 };
 var StyledUnstableColorIndicator3 = styled10(UnstableColorIndicator3)(({ theme }) => ({
   height: "1rem",
@@ -5765,28 +5883,28 @@ var getGradientValue = (value) => {
 
 // src/controls/background-control/background-control.tsx
 var clipOptions = [
-  { label: __37("Full element", "elementor"), value: "border-box" },
-  { label: __37("Padding edges", "elementor"), value: "padding-box" },
-  { label: __37("Content edges", "elementor"), value: "content-box" },
-  { label: __37("Text", "elementor"), value: "text" }
+  { label: __38("Full element", "elementor"), value: "border-box" },
+  { label: __38("Padding edges", "elementor"), value: "padding-box" },
+  { label: __38("Content edges", "elementor"), value: "content-box" },
+  { label: __38("Text", "elementor"), value: "text" }
 ];
-var colorLabel = __37("Color", "elementor");
-var clipLabel = __37("Clipping", "elementor");
+var colorLabel = __38("Color", "elementor");
+var clipLabel = __38("Clipping", "elementor");
 var BackgroundControl = createControl(() => {
   const propContext = useBoundProp(backgroundPropTypeUtil);
-  return /* @__PURE__ */ React86.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React86.createElement(PropKeyProvider, { bind: "background-overlay" }, /* @__PURE__ */ React86.createElement(BackgroundOverlayRepeaterControl, null)), /* @__PURE__ */ React86.createElement(BackgroundColorField, null), /* @__PURE__ */ React86.createElement(BackgroundClipField, null));
+  return /* @__PURE__ */ React88.createElement(PropProvider, { ...propContext }, /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "background-overlay" }, /* @__PURE__ */ React88.createElement(BackgroundOverlayRepeaterControl, null)), /* @__PURE__ */ React88.createElement(BackgroundColorField, null), /* @__PURE__ */ React88.createElement(BackgroundClipField, null));
 });
 var BackgroundColorField = () => {
-  return /* @__PURE__ */ React86.createElement(PropKeyProvider, { bind: "color" }, /* @__PURE__ */ React86.createElement(Grid17, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React86.createElement(Grid17, { item: true, xs: 6 }, /* @__PURE__ */ React86.createElement(ControlLabel, null, colorLabel)), /* @__PURE__ */ React86.createElement(Grid17, { item: true, xs: 6 }, /* @__PURE__ */ React86.createElement(ColorControl, null))));
+  return /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "color" }, /* @__PURE__ */ React88.createElement(Grid17, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React88.createElement(Grid17, { item: true, xs: 6 }, /* @__PURE__ */ React88.createElement(ControlLabel, null, colorLabel)), /* @__PURE__ */ React88.createElement(Grid17, { item: true, xs: 6 }, /* @__PURE__ */ React88.createElement(ColorControl, null))));
 };
 var BackgroundClipField = () => {
-  return /* @__PURE__ */ React86.createElement(PropKeyProvider, { bind: "clip" }, /* @__PURE__ */ React86.createElement(Grid17, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React86.createElement(Grid17, { item: true, xs: 6 }, /* @__PURE__ */ React86.createElement(ControlLabel, null, clipLabel)), /* @__PURE__ */ React86.createElement(Grid17, { item: true, xs: 6 }, /* @__PURE__ */ React86.createElement(SelectControl, { options: clipOptions }))));
+  return /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "clip" }, /* @__PURE__ */ React88.createElement(Grid17, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React88.createElement(Grid17, { item: true, xs: 6 }, /* @__PURE__ */ React88.createElement(ControlLabel, null, clipLabel)), /* @__PURE__ */ React88.createElement(Grid17, { item: true, xs: 6 }, /* @__PURE__ */ React88.createElement(SelectControl, { options: clipOptions }))));
 };
 
 // src/controls/repeatable-control.tsx
-import * as React87 from "react";
-import { useMemo as useMemo11 } from "react";
-import { createArrayPropUtils } from "@elementor/editor-props";
+import * as React89 from "react";
+import { useMemo as useMemo12 } from "react";
+import { createArrayPropUtils as createArrayPropUtils2 } from "@elementor/editor-props";
 import { Box as Box15 } from "@elementor/ui";
 var PLACEHOLDER_REGEX = /\$\{([^}]+)\}/g;
 var RepeatableControl = createControl(
@@ -5806,11 +5924,11 @@ var RepeatableControl = createControl(
     if (!childPropTypeUtil) {
       return null;
     }
-    const childArrayPropTypeUtil2 = useMemo11(
-      () => createArrayPropUtils(childPropTypeUtil.key, childPropTypeUtil.schema, propKey),
+    const childArrayPropTypeUtil2 = useMemo12(
+      () => createArrayPropUtils2(childPropTypeUtil.key, childPropTypeUtil.schema, propKey),
       [childPropTypeUtil.key, childPropTypeUtil.schema, propKey]
     );
-    const contextValue = useMemo11(
+    const contextValue = useMemo12(
       () => ({
         ...childControlConfig,
         placeholder: placeholder || "",
@@ -5820,14 +5938,14 @@ var RepeatableControl = createControl(
     );
     const { propType, value, setValue } = useBoundProp(childArrayPropTypeUtil2);
     const newItemIndex = addItemTooltipProps?.newItemIndex === null ? void 0 : 0;
-    return /* @__PURE__ */ React87.createElement(PropProvider, { propType, value, setValue }, /* @__PURE__ */ React87.createElement(RepeatableControlContext.Provider, { value: contextValue }, /* @__PURE__ */ React87.createElement(
+    return /* @__PURE__ */ React89.createElement(PropProvider, { propType, value, setValue }, /* @__PURE__ */ React89.createElement(RepeatableControlContext.Provider, { value: contextValue }, /* @__PURE__ */ React89.createElement(
       ControlRepeater,
       {
         initial: childPropTypeUtil.create(initialValues || null),
         propTypeUtil: childArrayPropTypeUtil2,
         isItemDisabled: isItemDisabled2
       },
-      /* @__PURE__ */ React87.createElement(RepeaterHeader, { label: repeaterLabel }, /* @__PURE__ */ React87.createElement(
+      /* @__PURE__ */ React89.createElement(RepeaterHeader, { label: repeaterLabel }, /* @__PURE__ */ React89.createElement(
         TooltipAddItemAction,
         {
           ...addItemTooltipProps,
@@ -5835,22 +5953,22 @@ var RepeatableControl = createControl(
           ariaLabel: repeaterLabel
         }
       )),
-      /* @__PURE__ */ React87.createElement(ItemsContainer, { isSortable }, /* @__PURE__ */ React87.createElement(
+      /* @__PURE__ */ React89.createElement(ItemsContainer, { isSortable }, /* @__PURE__ */ React89.createElement(
         Item,
         {
           Icon: ItemIcon3,
           Label: ItemLabel3,
-          actions: /* @__PURE__ */ React87.createElement(React87.Fragment, null, showDuplicate && /* @__PURE__ */ React87.createElement(DuplicateItemAction, null), showToggle && /* @__PURE__ */ React87.createElement(DisableItemAction, null), /* @__PURE__ */ React87.createElement(RemoveItemAction, null))
+          actions: /* @__PURE__ */ React89.createElement(React89.Fragment, null, showDuplicate && /* @__PURE__ */ React89.createElement(DuplicateItemAction, null), showToggle && /* @__PURE__ */ React89.createElement(DisableItemAction, null), /* @__PURE__ */ React89.createElement(RemoveItemAction, null))
         }
       )),
-      /* @__PURE__ */ React87.createElement(EditItemPopover, null, /* @__PURE__ */ React87.createElement(Content2, null))
+      /* @__PURE__ */ React89.createElement(EditItemPopover, null, /* @__PURE__ */ React89.createElement(Content2, null))
     )));
   }
 );
-var ItemIcon3 = () => /* @__PURE__ */ React87.createElement(React87.Fragment, null);
+var ItemIcon3 = () => /* @__PURE__ */ React89.createElement(React89.Fragment, null);
 var Content2 = () => {
   const { component: ChildControl, props = {} } = useRepeatableControlContext();
-  return /* @__PURE__ */ React87.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React87.createElement(PopoverGridContainer, null, /* @__PURE__ */ React87.createElement(ChildControl, { ...props })));
+  return /* @__PURE__ */ React89.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React89.createElement(PopoverGridContainer, null, /* @__PURE__ */ React89.createElement(ChildControl, { ...props })));
 };
 var interpolate = (template, data) => {
   if (!data) {
@@ -5933,7 +6051,7 @@ var ItemLabel3 = ({ value }) => {
   const label = showPlaceholder ? placeholder : interpolate(patternLabel, value);
   const isReadOnly = !!childProps?.readOnly;
   const color = getTextColor(isReadOnly, showPlaceholder);
-  return /* @__PURE__ */ React87.createElement(Box15, { component: "span", color }, label);
+  return /* @__PURE__ */ React89.createElement(Box15, { component: "span", color }, label);
 };
 var getAllProperties = (pattern) => {
   const properties = pattern.match(PLACEHOLDER_REGEX)?.map((match) => match.slice(2, -1)) || [];
@@ -5941,15 +6059,15 @@ var getAllProperties = (pattern) => {
 };
 
 // src/controls/key-value-control.tsx
-import * as React88 from "react";
-import { useMemo as useMemo12, useState as useState17 } from "react";
+import * as React90 from "react";
+import { useMemo as useMemo13, useState as useState17 } from "react";
 import {
   isTransformable,
   keyValuePropTypeUtil,
-  stringPropTypeUtil as stringPropTypeUtil15
+  stringPropTypeUtil as stringPropTypeUtil17
 } from "@elementor/editor-props";
 import { FormHelperText, FormLabel as FormLabel3, Grid as Grid18 } from "@elementor/ui";
-import { __ as __38 } from "@wordpress/i18n";
+import { __ as __39 } from "@wordpress/i18n";
 
 // src/utils/escape-html-attr.ts
 var escapeHtmlAttr = (value) => {
@@ -5979,17 +6097,17 @@ var KeyValueControl = createControl((props = {}) => {
     key: getInitialFieldValue(value?.key),
     value: getInitialFieldValue(value?.value)
   });
-  const keyLabel = props.keyName || __38("Key", "elementor");
-  const valueLabel = props.valueName || __38("Value", "elementor");
+  const keyLabel = props.keyName || __39("Key", "elementor");
+  const valueLabel = props.valueName || __39("Value", "elementor");
   const { keyHelper, valueHelper } = props.getHelperText?.(sessionState.key, sessionState.value) || {
     keyHelper: void 0,
     valueHelper: void 0
   };
-  const [keyRegex, valueRegex, errMsg] = useMemo12(
+  const [keyRegex, valueRegex, errMsg] = useMemo13(
     () => [
       props.regexKey ? new RegExp(props.regexKey) : void 0,
       props.regexValue ? new RegExp(props.regexValue) : void 0,
-      props.validationErrorMessage || __38("Invalid Format", "elementor")
+      props.validationErrorMessage || __39("Invalid Format", "elementor")
     ],
     [props.regexKey, props.regexValue, props.validationErrorMessage]
   );
@@ -6018,7 +6136,7 @@ var KeyValueControl = createControl((props = {}) => {
       });
       return;
     }
-    const extractedValue = stringPropTypeUtil15.extract(newChangedValue);
+    const extractedValue = stringPropTypeUtil17.extract(newChangedValue);
     setSessionState((prev) => ({
       ...prev,
       [fieldType]: extractedValue
@@ -6038,14 +6156,14 @@ var KeyValueControl = createControl((props = {}) => {
       });
     }
   };
-  return /* @__PURE__ */ React88.createElement(PropProvider, { ...propContext, value, setValue: handleChange }, /* @__PURE__ */ React88.createElement(Grid18, { container: true, gap: 1.5 }, /* @__PURE__ */ React88.createElement(Grid18, { item: true, xs: 12, display: "flex", flexDirection: "column" }, /* @__PURE__ */ React88.createElement(FormLabel3, { size: "tiny", sx: { pb: 1 } }, keyLabel), /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "key" }, /* @__PURE__ */ React88.createElement(
+  return /* @__PURE__ */ React90.createElement(PropProvider, { ...propContext, value, setValue: handleChange }, /* @__PURE__ */ React90.createElement(Grid18, { container: true, gap: 1.5 }, /* @__PURE__ */ React90.createElement(Grid18, { item: true, xs: 12, display: "flex", flexDirection: "column" }, /* @__PURE__ */ React90.createElement(FormLabel3, { size: "tiny", sx: { pb: 1 } }, keyLabel), /* @__PURE__ */ React90.createElement(PropKeyProvider, { bind: "key" }, /* @__PURE__ */ React90.createElement(
     TextControl,
     {
       inputValue: props.escapeHtml ? escapeHtmlAttr(sessionState.key) : sessionState.key,
       error: !!keyError,
       helperText: keyHelper
     }
-  )), !!keyError && /* @__PURE__ */ React88.createElement(FormHelperText, { error: true }, keyError)), /* @__PURE__ */ React88.createElement(Grid18, { item: true, xs: 12, display: "flex", flexDirection: "column" }, /* @__PURE__ */ React88.createElement(FormLabel3, { size: "tiny", sx: { pb: 1 } }, valueLabel), /* @__PURE__ */ React88.createElement(PropKeyProvider, { bind: "value" }, /* @__PURE__ */ React88.createElement(
+  )), !!keyError && /* @__PURE__ */ React90.createElement(FormHelperText, { error: true }, keyError)), /* @__PURE__ */ React90.createElement(Grid18, { item: true, xs: 12, display: "flex", flexDirection: "column" }, /* @__PURE__ */ React90.createElement(FormLabel3, { size: "tiny", sx: { pb: 1 } }, valueLabel), /* @__PURE__ */ React90.createElement(PropKeyProvider, { bind: "value" }, /* @__PURE__ */ React90.createElement(
     TextControl,
     {
       inputValue: props.escapeHtml ? escapeHtmlAttr(sessionState.value) : sessionState.value,
@@ -6053,31 +6171,31 @@ var KeyValueControl = createControl((props = {}) => {
       inputDisabled: !!keyError,
       helperText: valueHelper
     }
-  )), !!valueError && /* @__PURE__ */ React88.createElement(FormHelperText, { error: true }, valueError))));
+  )), !!valueError && /* @__PURE__ */ React90.createElement(FormHelperText, { error: true }, valueError))));
 });
 
 // src/controls/position-control.tsx
-import * as React89 from "react";
-import { positionPropTypeUtil, stringPropTypeUtil as stringPropTypeUtil16 } from "@elementor/editor-props";
+import * as React91 from "react";
+import { positionPropTypeUtil, stringPropTypeUtil as stringPropTypeUtil18 } from "@elementor/editor-props";
 import { MenuListItem as MenuListItem7 } from "@elementor/editor-ui";
 import { LetterXIcon as LetterXIcon2, LetterYIcon as LetterYIcon2 } from "@elementor/icons";
 import { Grid as Grid19, Select as Select5 } from "@elementor/ui";
-import { __ as __39 } from "@wordpress/i18n";
+import { __ as __40 } from "@wordpress/i18n";
 var positionOptions = [
-  { label: __39("Center center", "elementor"), value: "center center" },
-  { label: __39("Center left", "elementor"), value: "center left" },
-  { label: __39("Center right", "elementor"), value: "center right" },
-  { label: __39("Top center", "elementor"), value: "top center" },
-  { label: __39("Top left", "elementor"), value: "top left" },
-  { label: __39("Top right", "elementor"), value: "top right" },
-  { label: __39("Bottom center", "elementor"), value: "bottom center" },
-  { label: __39("Bottom left", "elementor"), value: "bottom left" },
-  { label: __39("Bottom right", "elementor"), value: "bottom right" },
-  { label: __39("Custom", "elementor"), value: "custom" }
+  { label: __40("Center center", "elementor"), value: "center center" },
+  { label: __40("Center left", "elementor"), value: "center left" },
+  { label: __40("Center right", "elementor"), value: "center right" },
+  { label: __40("Top center", "elementor"), value: "top center" },
+  { label: __40("Top left", "elementor"), value: "top left" },
+  { label: __40("Top right", "elementor"), value: "top right" },
+  { label: __40("Bottom center", "elementor"), value: "bottom center" },
+  { label: __40("Bottom left", "elementor"), value: "bottom left" },
+  { label: __40("Bottom right", "elementor"), value: "bottom right" },
+  { label: __40("Custom", "elementor"), value: "custom" }
 ];
 var PositionControl = () => {
   const positionContext = useBoundProp(positionPropTypeUtil);
-  const stringPropContext = useBoundProp(stringPropTypeUtil16);
+  const stringPropContext = useBoundProp(stringPropTypeUtil18);
   const isCustom = !!positionContext.value;
   const placeholder = positionContext.placeholder ? "custom" : stringPropContext.placeholder ?? null;
   const handlePositionChange = (event) => {
@@ -6088,7 +6206,7 @@ var PositionControl = () => {
       stringPropContext.setValue(value);
     }
   };
-  return /* @__PURE__ */ React89.createElement(Grid19, { container: true, spacing: 1.5 }, /* @__PURE__ */ React89.createElement(Grid19, { item: true, xs: 12 }, /* @__PURE__ */ React89.createElement(Grid19, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React89.createElement(Grid19, { item: true, xs: 6 }, /* @__PURE__ */ React89.createElement(ControlFormLabel, null, __39("Object position", "elementor"))), /* @__PURE__ */ React89.createElement(Grid19, { item: true, xs: 6, sx: { overflow: "hidden" } }, /* @__PURE__ */ React89.createElement(
+  return /* @__PURE__ */ React91.createElement(Grid19, { container: true, spacing: 1.5 }, /* @__PURE__ */ React91.createElement(Grid19, { item: true, xs: 12 }, /* @__PURE__ */ React91.createElement(Grid19, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React91.createElement(Grid19, { item: true, xs: 6 }, /* @__PURE__ */ React91.createElement(ControlFormLabel, null, __40("Object position", "elementor"))), /* @__PURE__ */ React91.createElement(Grid19, { item: true, xs: 6, sx: { overflow: "hidden" } }, /* @__PURE__ */ React91.createElement(
     Select5,
     {
       size: "tiny",
@@ -6099,33 +6217,33 @@ var PositionControl = () => {
       renderValue: (selectedValue) => getSelectRenderValue(positionOptions, placeholder, selectedValue),
       fullWidth: true
     },
-    positionOptions.map(({ label, value }) => /* @__PURE__ */ React89.createElement(MenuListItem7, { key: value, value: value ?? "" }, label))
-  )))), isCustom && /* @__PURE__ */ React89.createElement(PropProvider, { ...positionContext }, /* @__PURE__ */ React89.createElement(Grid19, { item: true, xs: 12 }, /* @__PURE__ */ React89.createElement(Grid19, { container: true, spacing: 1.5 }, /* @__PURE__ */ React89.createElement(Grid19, { item: true, xs: 6 }, /* @__PURE__ */ React89.createElement(PropKeyProvider, { bind: "x" }, /* @__PURE__ */ React89.createElement(
+    positionOptions.map(({ label, value }) => /* @__PURE__ */ React91.createElement(MenuListItem7, { key: value, value: value ?? "" }, label))
+  )))), isCustom && /* @__PURE__ */ React91.createElement(PropProvider, { ...positionContext }, /* @__PURE__ */ React91.createElement(Grid19, { item: true, xs: 12 }, /* @__PURE__ */ React91.createElement(Grid19, { container: true, spacing: 1.5 }, /* @__PURE__ */ React91.createElement(Grid19, { item: true, xs: 6 }, /* @__PURE__ */ React91.createElement(PropKeyProvider, { bind: "x" }, /* @__PURE__ */ React91.createElement(
     SizeControl,
     {
-      startIcon: /* @__PURE__ */ React89.createElement(LetterXIcon2, { fontSize: "tiny" }),
+      startIcon: /* @__PURE__ */ React91.createElement(LetterXIcon2, { fontSize: "tiny" }),
       min: -Number.MAX_SAFE_INTEGER
     }
-  ))), /* @__PURE__ */ React89.createElement(Grid19, { item: true, xs: 6 }, /* @__PURE__ */ React89.createElement(PropKeyProvider, { bind: "y" }, /* @__PURE__ */ React89.createElement(
+  ))), /* @__PURE__ */ React91.createElement(Grid19, { item: true, xs: 6 }, /* @__PURE__ */ React91.createElement(PropKeyProvider, { bind: "y" }, /* @__PURE__ */ React91.createElement(
     SizeControl,
     {
-      startIcon: /* @__PURE__ */ React89.createElement(LetterYIcon2, { fontSize: "tiny" }),
+      startIcon: /* @__PURE__ */ React91.createElement(LetterYIcon2, { fontSize: "tiny" }),
       min: -Number.MAX_SAFE_INTEGER
     }
   )))))));
 };
 
 // src/controls/transform-control/transform-repeater-control.tsx
-import * as React102 from "react";
+import * as React104 from "react";
 import { useRef as useRef24 } from "react";
 import { transformFunctionsPropTypeUtil, transformPropTypeUtil } from "@elementor/editor-props";
 import { AdjustmentsIcon as AdjustmentsIcon2, InfoCircleFilledIcon as InfoCircleFilledIcon2 } from "@elementor/icons";
 import { bindTrigger as bindTrigger5, Box as Box19, IconButton as IconButton7, Tooltip as Tooltip8, Typography as Typography7, usePopupState as usePopupState8 } from "@elementor/ui";
-import { __ as __49 } from "@wordpress/i18n";
+import { __ as __50 } from "@wordpress/i18n";
 
 // src/controls/transform-control/initial-values.ts
 import {
-  numberPropTypeUtil as numberPropTypeUtil4,
+  numberPropTypeUtil as numberPropTypeUtil6,
   rotateTransformPropTypeUtil,
   scaleTransformPropTypeUtil,
   skewTransformPropTypeUtil
@@ -6160,9 +6278,9 @@ var initialTransformValue = {
   }
 };
 var initialScaleValue = scaleTransformPropTypeUtil.create({
-  x: numberPropTypeUtil4.create(defaultValues.scale),
-  y: numberPropTypeUtil4.create(defaultValues.scale),
-  z: numberPropTypeUtil4.create(defaultValues.scale)
+  x: numberPropTypeUtil6.create(defaultValues.scale),
+  y: numberPropTypeUtil6.create(defaultValues.scale),
+  z: numberPropTypeUtil6.create(defaultValues.scale)
 });
 var initialRotateValue = rotateTransformPropTypeUtil.create({
   x: { $$type: "size", value: { size: defaultValues.rotate.size, unit: defaultValues.rotate.unit } },
@@ -6175,24 +6293,24 @@ var initialSkewValue = skewTransformPropTypeUtil.create({
 });
 
 // src/controls/transform-control/transform-content.tsx
-import * as React96 from "react";
+import * as React98 from "react";
 import { Box as Box16, Tab as Tab2, TabPanel as TabPanel2, Tabs as Tabs2 } from "@elementor/ui";
-import { __ as __44 } from "@wordpress/i18n";
+import { __ as __45 } from "@wordpress/i18n";
 
 // src/controls/transform-control/functions/move.tsx
-import * as React91 from "react";
+import * as React93 from "react";
 import { useRef as useRef17 } from "react";
 import { moveTransformPropTypeUtil } from "@elementor/editor-props";
 import { ArrowDownLeftIcon, ArrowDownSmallIcon, ArrowRightIcon } from "@elementor/icons";
 import { Grid as Grid21 } from "@elementor/ui";
-import { __ as __40 } from "@wordpress/i18n";
+import { __ as __41 } from "@wordpress/i18n";
 
 // src/controls/transform-control/functions/axis-row.tsx
-import * as React90 from "react";
+import * as React92 from "react";
 import { Grid as Grid20 } from "@elementor/ui";
 var AxisRow = ({ label, bind, startIcon, anchorRef, units: units2, variant = "angle" }) => {
   const safeId = label.replace(/\s+/g, "-").toLowerCase();
-  return /* @__PURE__ */ React90.createElement(Grid20, { item: true, xs: 12 }, /* @__PURE__ */ React90.createElement(PopoverGridContainer, { ref: anchorRef }, /* @__PURE__ */ React90.createElement(Grid20, { item: true, xs: 6 }, /* @__PURE__ */ React90.createElement(ControlLabel, { htmlFor: safeId }, label)), /* @__PURE__ */ React90.createElement(Grid20, { item: true, xs: 6 }, /* @__PURE__ */ React90.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React90.createElement(
+  return /* @__PURE__ */ React92.createElement(Grid20, { item: true, xs: 12 }, /* @__PURE__ */ React92.createElement(PopoverGridContainer, { ref: anchorRef }, /* @__PURE__ */ React92.createElement(Grid20, { item: true, xs: 6 }, /* @__PURE__ */ React92.createElement(ControlLabel, { htmlFor: safeId }, label)), /* @__PURE__ */ React92.createElement(Grid20, { item: true, xs: 6 }, /* @__PURE__ */ React92.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React92.createElement(
     SizeControl,
     {
       anchorRef,
@@ -6208,28 +6326,28 @@ var AxisRow = ({ label, bind, startIcon, anchorRef, units: units2, variant = "an
 // src/controls/transform-control/functions/move.tsx
 var moveAxisControls = [
   {
-    label: __40("Move X", "elementor"),
+    label: __41("Move X", "elementor"),
     bind: "x",
-    startIcon: /* @__PURE__ */ React91.createElement(ArrowRightIcon, { fontSize: "tiny" }),
+    startIcon: /* @__PURE__ */ React93.createElement(ArrowRightIcon, { fontSize: "tiny" }),
     units: ["px", "%", "em", "rem", "vw"]
   },
   {
-    label: __40("Move Y", "elementor"),
+    label: __41("Move Y", "elementor"),
     bind: "y",
-    startIcon: /* @__PURE__ */ React91.createElement(ArrowDownSmallIcon, { fontSize: "tiny" }),
+    startIcon: /* @__PURE__ */ React93.createElement(ArrowDownSmallIcon, { fontSize: "tiny" }),
     units: ["px", "%", "em", "rem", "vh"]
   },
   {
-    label: __40("Move Z", "elementor"),
+    label: __41("Move Z", "elementor"),
     bind: "z",
-    startIcon: /* @__PURE__ */ React91.createElement(ArrowDownLeftIcon, { fontSize: "tiny" }),
+    startIcon: /* @__PURE__ */ React93.createElement(ArrowDownLeftIcon, { fontSize: "tiny" }),
     units: ["px", "%", "em", "rem", "vw", "vh"]
   }
 ];
 var Move = () => {
   const context = useBoundProp(moveTransformPropTypeUtil);
   const rowRefs = [useRef17(null), useRef17(null), useRef17(null)];
-  return /* @__PURE__ */ React91.createElement(Grid21, { container: true, spacing: 1.5 }, /* @__PURE__ */ React91.createElement(PropProvider, { ...context }, /* @__PURE__ */ React91.createElement(PropKeyProvider, { bind: TransformFunctionKeys.move }, moveAxisControls.map((control, index) => /* @__PURE__ */ React91.createElement(
+  return /* @__PURE__ */ React93.createElement(Grid21, { container: true, spacing: 1.5 }, /* @__PURE__ */ React93.createElement(PropProvider, { ...context }, /* @__PURE__ */ React93.createElement(PropKeyProvider, { bind: TransformFunctionKeys.move }, moveAxisControls.map((control, index) => /* @__PURE__ */ React93.createElement(
     AxisRow,
     {
       key: control.bind,
@@ -6242,34 +6360,34 @@ var Move = () => {
 };
 
 // src/controls/transform-control/functions/rotate.tsx
-import * as React92 from "react";
+import * as React94 from "react";
 import { useRef as useRef18 } from "react";
 import { rotateTransformPropTypeUtil as rotateTransformPropTypeUtil2 } from "@elementor/editor-props";
 import { Arrow360Icon, RotateClockwiseIcon } from "@elementor/icons";
 import { Grid as Grid22 } from "@elementor/ui";
-import { __ as __41 } from "@wordpress/i18n";
+import { __ as __42 } from "@wordpress/i18n";
 var rotateAxisControls = [
   {
-    label: __41("Rotate X", "elementor"),
+    label: __42("Rotate X", "elementor"),
     bind: "x",
-    startIcon: /* @__PURE__ */ React92.createElement(Arrow360Icon, { fontSize: "tiny" })
+    startIcon: /* @__PURE__ */ React94.createElement(Arrow360Icon, { fontSize: "tiny" })
   },
   {
-    label: __41("Rotate Y", "elementor"),
+    label: __42("Rotate Y", "elementor"),
     bind: "y",
-    startIcon: /* @__PURE__ */ React92.createElement(Arrow360Icon, { fontSize: "tiny", style: { transform: "scaleX(-1) rotate(-90deg)" } })
+    startIcon: /* @__PURE__ */ React94.createElement(Arrow360Icon, { fontSize: "tiny", style: { transform: "scaleX(-1) rotate(-90deg)" } })
   },
   {
-    label: __41("Rotate Z", "elementor"),
+    label: __42("Rotate Z", "elementor"),
     bind: "z",
-    startIcon: /* @__PURE__ */ React92.createElement(RotateClockwiseIcon, { fontSize: "tiny" })
+    startIcon: /* @__PURE__ */ React94.createElement(RotateClockwiseIcon, { fontSize: "tiny" })
   }
 ];
 var rotateUnits = ["deg", "rad", "grad", "turn"];
 var Rotate = () => {
   const context = useBoundProp(rotateTransformPropTypeUtil2);
   const rowRefs = [useRef18(null), useRef18(null), useRef18(null)];
-  return /* @__PURE__ */ React92.createElement(Grid22, { container: true, spacing: 1.5 }, /* @__PURE__ */ React92.createElement(PropProvider, { ...context }, /* @__PURE__ */ React92.createElement(PropKeyProvider, { bind: TransformFunctionKeys.rotate }, rotateAxisControls.map((control, index) => /* @__PURE__ */ React92.createElement(
+  return /* @__PURE__ */ React94.createElement(Grid22, { container: true, spacing: 1.5 }, /* @__PURE__ */ React94.createElement(PropProvider, { ...context }, /* @__PURE__ */ React94.createElement(PropKeyProvider, { bind: TransformFunctionKeys.rotate }, rotateAxisControls.map((control, index) => /* @__PURE__ */ React94.createElement(
     AxisRow,
     {
       key: control.bind,
@@ -6281,68 +6399,68 @@ var Rotate = () => {
 };
 
 // src/controls/transform-control/functions/scale.tsx
-import * as React94 from "react";
+import * as React96 from "react";
 import { useRef as useRef19 } from "react";
 import { scaleTransformPropTypeUtil as scaleTransformPropTypeUtil2 } from "@elementor/editor-props";
 import { ArrowDownLeftIcon as ArrowDownLeftIcon2, ArrowDownSmallIcon as ArrowDownSmallIcon2, ArrowRightIcon as ArrowRightIcon2 } from "@elementor/icons";
 import { Grid as Grid24 } from "@elementor/ui";
-import { __ as __42 } from "@wordpress/i18n";
+import { __ as __43 } from "@wordpress/i18n";
 
 // src/controls/transform-control/functions/scale-axis-row.tsx
-import * as React93 from "react";
+import * as React95 from "react";
 import { Grid as Grid23 } from "@elementor/ui";
 var ScaleAxisRow = ({ label, bind, startIcon, anchorRef }) => {
-  return /* @__PURE__ */ React93.createElement(Grid23, { item: true, xs: 12 }, /* @__PURE__ */ React93.createElement(PopoverGridContainer, { ref: anchorRef }, /* @__PURE__ */ React93.createElement(Grid23, { item: true, xs: 6 }, /* @__PURE__ */ React93.createElement(ControlLabel, null, label)), /* @__PURE__ */ React93.createElement(Grid23, { item: true, xs: 6 }, /* @__PURE__ */ React93.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React93.createElement(NumberControl, { step: 0.1, placeholder: "1", startIcon })))));
+  return /* @__PURE__ */ React95.createElement(Grid23, { item: true, xs: 12 }, /* @__PURE__ */ React95.createElement(PopoverGridContainer, { ref: anchorRef }, /* @__PURE__ */ React95.createElement(Grid23, { item: true, xs: 6 }, /* @__PURE__ */ React95.createElement(ControlLabel, null, label)), /* @__PURE__ */ React95.createElement(Grid23, { item: true, xs: 6 }, /* @__PURE__ */ React95.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React95.createElement(NumberControl, { step: 0.1, placeholder: "1", startIcon })))));
 };
 
 // src/controls/transform-control/functions/scale.tsx
 var scaleAxisControls = [
   {
-    label: __42("Scale X", "elementor"),
+    label: __43("Scale X", "elementor"),
     bind: "x",
-    startIcon: /* @__PURE__ */ React94.createElement(ArrowRightIcon2, { fontSize: "tiny" })
+    startIcon: /* @__PURE__ */ React96.createElement(ArrowRightIcon2, { fontSize: "tiny" })
   },
   {
-    label: __42("Scale Y", "elementor"),
+    label: __43("Scale Y", "elementor"),
     bind: "y",
-    startIcon: /* @__PURE__ */ React94.createElement(ArrowDownSmallIcon2, { fontSize: "tiny" })
+    startIcon: /* @__PURE__ */ React96.createElement(ArrowDownSmallIcon2, { fontSize: "tiny" })
   },
   {
-    label: __42("Scale Z", "elementor"),
+    label: __43("Scale Z", "elementor"),
     bind: "z",
-    startIcon: /* @__PURE__ */ React94.createElement(ArrowDownLeftIcon2, { fontSize: "tiny" })
+    startIcon: /* @__PURE__ */ React96.createElement(ArrowDownLeftIcon2, { fontSize: "tiny" })
   }
 ];
 var Scale = () => {
   const context = useBoundProp(scaleTransformPropTypeUtil2);
   const rowRefs = [useRef19(null), useRef19(null), useRef19(null)];
-  return /* @__PURE__ */ React94.createElement(Grid24, { container: true, spacing: 1.5 }, /* @__PURE__ */ React94.createElement(PropProvider, { ...context }, /* @__PURE__ */ React94.createElement(PropKeyProvider, { bind: TransformFunctionKeys.scale }, scaleAxisControls.map((control, index) => /* @__PURE__ */ React94.createElement(ScaleAxisRow, { key: control.bind, ...control, anchorRef: rowRefs[index] })))));
+  return /* @__PURE__ */ React96.createElement(Grid24, { container: true, spacing: 1.5 }, /* @__PURE__ */ React96.createElement(PropProvider, { ...context }, /* @__PURE__ */ React96.createElement(PropKeyProvider, { bind: TransformFunctionKeys.scale }, scaleAxisControls.map((control, index) => /* @__PURE__ */ React96.createElement(ScaleAxisRow, { key: control.bind, ...control, anchorRef: rowRefs[index] })))));
 };
 
 // src/controls/transform-control/functions/skew.tsx
-import * as React95 from "react";
+import * as React97 from "react";
 import { useRef as useRef20 } from "react";
 import { skewTransformPropTypeUtil as skewTransformPropTypeUtil2 } from "@elementor/editor-props";
 import { ArrowLeftIcon, ArrowRightIcon as ArrowRightIcon3 } from "@elementor/icons";
 import { Grid as Grid25 } from "@elementor/ui";
-import { __ as __43 } from "@wordpress/i18n";
+import { __ as __44 } from "@wordpress/i18n";
 var skewAxisControls = [
   {
-    label: __43("Skew X", "elementor"),
+    label: __44("Skew X", "elementor"),
     bind: "x",
-    startIcon: /* @__PURE__ */ React95.createElement(ArrowRightIcon3, { fontSize: "tiny" })
+    startIcon: /* @__PURE__ */ React97.createElement(ArrowRightIcon3, { fontSize: "tiny" })
   },
   {
-    label: __43("Skew Y", "elementor"),
+    label: __44("Skew Y", "elementor"),
     bind: "y",
-    startIcon: /* @__PURE__ */ React95.createElement(ArrowLeftIcon, { fontSize: "tiny", style: { transform: "scaleX(-1) rotate(-90deg)" } })
+    startIcon: /* @__PURE__ */ React97.createElement(ArrowLeftIcon, { fontSize: "tiny", style: { transform: "scaleX(-1) rotate(-90deg)" } })
   }
 ];
 var skewUnits = ["deg", "rad", "grad", "turn"];
 var Skew = () => {
   const context = useBoundProp(skewTransformPropTypeUtil2);
   const rowRefs = [useRef20(null), useRef20(null), useRef20(null)];
-  return /* @__PURE__ */ React95.createElement(Grid25, { container: true, spacing: 1.5 }, /* @__PURE__ */ React95.createElement(PropProvider, { ...context }, /* @__PURE__ */ React95.createElement(PropKeyProvider, { bind: TransformFunctionKeys.skew }, skewAxisControls.map((control, index) => /* @__PURE__ */ React95.createElement(
+  return /* @__PURE__ */ React97.createElement(Grid25, { container: true, spacing: 1.5 }, /* @__PURE__ */ React97.createElement(PropProvider, { ...context }, /* @__PURE__ */ React97.createElement(PropKeyProvider, { bind: TransformFunctionKeys.skew }, skewAxisControls.map((control, index) => /* @__PURE__ */ React97.createElement(
     AxisRow,
     {
       key: control.bind,
@@ -6447,7 +6565,7 @@ var TransformContent = () => {
     rotate: initialRotateValue.value,
     skew: initialSkewValue.value
   });
-  return /* @__PURE__ */ React96.createElement(PopoverContent, null, /* @__PURE__ */ React96.createElement(Box16, { sx: { width: "100%" } }, /* @__PURE__ */ React96.createElement(Box16, { sx: { borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React96.createElement(
+  return /* @__PURE__ */ React98.createElement(PopoverContent, null, /* @__PURE__ */ React98.createElement(Box16, { sx: { width: "100%" } }, /* @__PURE__ */ React98.createElement(Box16, { sx: { borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React98.createElement(
     Tabs2,
     {
       size: "small",
@@ -6458,37 +6576,37 @@ var TransformContent = () => {
         }
       },
       ...getTabsProps(),
-      "aria-label": __44("Transform", "elementor")
+      "aria-label": __45("Transform", "elementor")
     },
-    /* @__PURE__ */ React96.createElement(Tab2, { label: __44("Move", "elementor"), ...getTabProps(TransformFunctionKeys.move) }),
-    /* @__PURE__ */ React96.createElement(Tab2, { label: __44("Scale", "elementor"), ...getTabProps(TransformFunctionKeys.scale) }),
-    /* @__PURE__ */ React96.createElement(Tab2, { label: __44("Rotate", "elementor"), ...getTabProps(TransformFunctionKeys.rotate) }),
-    /* @__PURE__ */ React96.createElement(Tab2, { label: __44("Skew", "elementor"), ...getTabProps(TransformFunctionKeys.skew) })
-  )), /* @__PURE__ */ React96.createElement(TabPanel2, { sx: { p: 1.5 }, ...getTabPanelProps(TransformFunctionKeys.move) }, /* @__PURE__ */ React96.createElement(Move, null)), /* @__PURE__ */ React96.createElement(TabPanel2, { sx: { p: 1.5 }, ...getTabPanelProps(TransformFunctionKeys.scale) }, /* @__PURE__ */ React96.createElement(Scale, null)), /* @__PURE__ */ React96.createElement(TabPanel2, { sx: { p: 1.5 }, ...getTabPanelProps(TransformFunctionKeys.rotate) }, /* @__PURE__ */ React96.createElement(Rotate, null)), /* @__PURE__ */ React96.createElement(TabPanel2, { sx: { p: 1.5 }, ...getTabPanelProps(TransformFunctionKeys.skew) }, /* @__PURE__ */ React96.createElement(Skew, null))));
+    /* @__PURE__ */ React98.createElement(Tab2, { label: __45("Move", "elementor"), ...getTabProps(TransformFunctionKeys.move) }),
+    /* @__PURE__ */ React98.createElement(Tab2, { label: __45("Scale", "elementor"), ...getTabProps(TransformFunctionKeys.scale) }),
+    /* @__PURE__ */ React98.createElement(Tab2, { label: __45("Rotate", "elementor"), ...getTabProps(TransformFunctionKeys.rotate) }),
+    /* @__PURE__ */ React98.createElement(Tab2, { label: __45("Skew", "elementor"), ...getTabProps(TransformFunctionKeys.skew) })
+  )), /* @__PURE__ */ React98.createElement(TabPanel2, { sx: { p: 1.5 }, ...getTabPanelProps(TransformFunctionKeys.move) }, /* @__PURE__ */ React98.createElement(Move, null)), /* @__PURE__ */ React98.createElement(TabPanel2, { sx: { p: 1.5 }, ...getTabPanelProps(TransformFunctionKeys.scale) }, /* @__PURE__ */ React98.createElement(Scale, null)), /* @__PURE__ */ React98.createElement(TabPanel2, { sx: { p: 1.5 }, ...getTabPanelProps(TransformFunctionKeys.rotate) }, /* @__PURE__ */ React98.createElement(Rotate, null)), /* @__PURE__ */ React98.createElement(TabPanel2, { sx: { p: 1.5 }, ...getTabPanelProps(TransformFunctionKeys.skew) }, /* @__PURE__ */ React98.createElement(Skew, null))));
 };
 
 // src/controls/transform-control/transform-icon.tsx
-import * as React97 from "react";
+import * as React99 from "react";
 import { ArrowAutofitHeightIcon, ArrowsMaximizeIcon as ArrowsMaximizeIcon2, RotateClockwise2Icon, SkewXIcon } from "@elementor/icons";
 var TransformIcon = ({ value }) => {
   switch (value.$$type) {
     case TransformFunctionKeys.move:
-      return /* @__PURE__ */ React97.createElement(ArrowsMaximizeIcon2, { fontSize: "tiny" });
+      return /* @__PURE__ */ React99.createElement(ArrowsMaximizeIcon2, { fontSize: "tiny" });
     case TransformFunctionKeys.scale:
-      return /* @__PURE__ */ React97.createElement(ArrowAutofitHeightIcon, { fontSize: "tiny" });
+      return /* @__PURE__ */ React99.createElement(ArrowAutofitHeightIcon, { fontSize: "tiny" });
     case TransformFunctionKeys.rotate:
-      return /* @__PURE__ */ React97.createElement(RotateClockwise2Icon, { fontSize: "tiny" });
+      return /* @__PURE__ */ React99.createElement(RotateClockwise2Icon, { fontSize: "tiny" });
     case TransformFunctionKeys.skew:
-      return /* @__PURE__ */ React97.createElement(SkewXIcon, { fontSize: "tiny" });
+      return /* @__PURE__ */ React99.createElement(SkewXIcon, { fontSize: "tiny" });
     default:
       return null;
   }
 };
 
 // src/controls/transform-control/transform-label.tsx
-import * as React98 from "react";
+import * as React100 from "react";
 import { Box as Box17 } from "@elementor/ui";
-import { __ as __45 } from "@wordpress/i18n";
+import { __ as __46 } from "@wordpress/i18n";
 var orderedAxis = ["x", "y", "z"];
 var formatLabel = (value, functionType) => {
   return orderedAxis.map((axisKey) => {
@@ -6506,102 +6624,102 @@ var TransformLabel = (props) => {
   const { $$type, value } = props.value;
   switch ($$type) {
     case TransformFunctionKeys.move:
-      return /* @__PURE__ */ React98.createElement(Label2, { label: __45("Move", "elementor"), value: formatLabel(value, "move") });
+      return /* @__PURE__ */ React100.createElement(Label2, { label: __46("Move", "elementor"), value: formatLabel(value, "move") });
     case TransformFunctionKeys.scale:
-      return /* @__PURE__ */ React98.createElement(Label2, { label: __45("Scale", "elementor"), value: formatLabel(value, "scale") });
+      return /* @__PURE__ */ React100.createElement(Label2, { label: __46("Scale", "elementor"), value: formatLabel(value, "scale") });
     case TransformFunctionKeys.rotate:
-      return /* @__PURE__ */ React98.createElement(Label2, { label: __45("Rotate", "elementor"), value: formatLabel(value, "rotate") });
+      return /* @__PURE__ */ React100.createElement(Label2, { label: __46("Rotate", "elementor"), value: formatLabel(value, "rotate") });
     case TransformFunctionKeys.skew:
-      return /* @__PURE__ */ React98.createElement(Label2, { label: __45("Skew", "elementor"), value: formatLabel(value, "skew") });
+      return /* @__PURE__ */ React100.createElement(Label2, { label: __46("Skew", "elementor"), value: formatLabel(value, "skew") });
     default:
       return "";
   }
 };
 var Label2 = ({ label, value }) => {
-  return /* @__PURE__ */ React98.createElement(Box17, { component: "span" }, label, ": ", value);
+  return /* @__PURE__ */ React100.createElement(Box17, { component: "span" }, label, ": ", value);
 };
 
 // src/controls/transform-control/transform-settings-control.tsx
-import * as React101 from "react";
+import * as React103 from "react";
 import { PopoverHeader as PopoverHeader4 } from "@elementor/editor-ui";
 import { AdjustmentsIcon } from "@elementor/icons";
 import { bindPopover as bindPopover6, Box as Box18, Divider as Divider4, Popover as Popover6 } from "@elementor/ui";
-import { __ as __48 } from "@wordpress/i18n";
+import { __ as __49 } from "@wordpress/i18n";
 
 // src/controls/transform-control/transform-base-controls/children-perspective-control.tsx
-import * as React99 from "react";
+import * as React101 from "react";
 import { useRef as useRef22 } from "react";
 import { perspectiveOriginPropTypeUtil } from "@elementor/editor-props";
 import { Grid as Grid26, Stack as Stack15 } from "@elementor/ui";
-import { __ as __46 } from "@wordpress/i18n";
+import { __ as __47 } from "@wordpress/i18n";
 var ORIGIN_UNITS = ["px", "%", "em", "rem"];
 var PERSPECTIVE_CONTROL_FIELD = {
-  label: __46("Perspective", "elementor"),
+  label: __47("Perspective", "elementor"),
   bind: "perspective",
   units: ["px", "em", "rem", "vw", "vh"]
 };
 var CHILDREN_PERSPECTIVE_FIELDS = [
   {
-    label: __46("Origin X", "elementor"),
+    label: __47("Origin X", "elementor"),
     bind: "x",
     units: ORIGIN_UNITS
   },
   {
-    label: __46("Origin Y", "elementor"),
+    label: __47("Origin Y", "elementor"),
     bind: "y",
     units: ORIGIN_UNITS
   }
 ];
 var ChildrenPerspectiveControl = () => {
-  return /* @__PURE__ */ React99.createElement(Stack15, { direction: "column", spacing: 1.5 }, /* @__PURE__ */ React99.createElement(ControlFormLabel, null, __46("Children perspective", "elementor")), /* @__PURE__ */ React99.createElement(PerspectiveControl, null), /* @__PURE__ */ React99.createElement(PerspectiveOriginControl, null));
+  return /* @__PURE__ */ React101.createElement(Stack15, { direction: "column", spacing: 1.5 }, /* @__PURE__ */ React101.createElement(ControlFormLabel, null, __47("Children perspective", "elementor")), /* @__PURE__ */ React101.createElement(PerspectiveControl, null), /* @__PURE__ */ React101.createElement(PerspectiveOriginControl, null));
 };
-var PerspectiveControl = () => /* @__PURE__ */ React99.createElement(PropKeyProvider, { bind: "perspective" }, /* @__PURE__ */ React99.createElement(ControlFields, { control: PERSPECTIVE_CONTROL_FIELD, key: PERSPECTIVE_CONTROL_FIELD.bind }));
-var PerspectiveOriginControl = () => /* @__PURE__ */ React99.createElement(PropKeyProvider, { bind: "perspective-origin" }, /* @__PURE__ */ React99.createElement(PerspectiveOriginControlProvider, null));
+var PerspectiveControl = () => /* @__PURE__ */ React101.createElement(PropKeyProvider, { bind: "perspective" }, /* @__PURE__ */ React101.createElement(ControlFields, { control: PERSPECTIVE_CONTROL_FIELD, key: PERSPECTIVE_CONTROL_FIELD.bind }));
+var PerspectiveOriginControl = () => /* @__PURE__ */ React101.createElement(PropKeyProvider, { bind: "perspective-origin" }, /* @__PURE__ */ React101.createElement(PerspectiveOriginControlProvider, null));
 var PerspectiveOriginControlProvider = () => {
   const context = useBoundProp(perspectiveOriginPropTypeUtil);
-  return /* @__PURE__ */ React99.createElement(PropProvider, { ...context }, CHILDREN_PERSPECTIVE_FIELDS.map((control) => /* @__PURE__ */ React99.createElement(PropKeyProvider, { bind: control.bind, key: control.bind }, /* @__PURE__ */ React99.createElement(ControlFields, { control }))));
+  return /* @__PURE__ */ React101.createElement(PropProvider, { ...context }, CHILDREN_PERSPECTIVE_FIELDS.map((control) => /* @__PURE__ */ React101.createElement(PropKeyProvider, { bind: control.bind, key: control.bind }, /* @__PURE__ */ React101.createElement(ControlFields, { control }))));
 };
 var ControlFields = ({ control }) => {
   const rowRef = useRef22(null);
-  return /* @__PURE__ */ React99.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React99.createElement(Grid26, { item: true, xs: 6 }, /* @__PURE__ */ React99.createElement(ControlFormLabel, null, control.label)), /* @__PURE__ */ React99.createElement(Grid26, { item: true, xs: 6 }, /* @__PURE__ */ React99.createElement(SizeControl, { variant: "length", units: control.units, anchorRef: rowRef, disableCustom: true })));
+  return /* @__PURE__ */ React101.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React101.createElement(Grid26, { item: true, xs: 6 }, /* @__PURE__ */ React101.createElement(ControlFormLabel, null, control.label)), /* @__PURE__ */ React101.createElement(Grid26, { item: true, xs: 6 }, /* @__PURE__ */ React101.createElement(SizeControl, { variant: "length", units: control.units, anchorRef: rowRef, disableCustom: true })));
 };
 
 // src/controls/transform-control/transform-base-controls/transform-origin-control.tsx
-import * as React100 from "react";
+import * as React102 from "react";
 import { useRef as useRef23 } from "react";
 import { transformOriginPropTypeUtil } from "@elementor/editor-props";
 import { Grid as Grid27, Stack as Stack16 } from "@elementor/ui";
-import { __ as __47 } from "@wordpress/i18n";
+import { __ as __48 } from "@wordpress/i18n";
 var TRANSFORM_ORIGIN_UNITS = ["px", "%", "em", "rem"];
 var TRANSFORM_ORIGIN_UNITS_Z_AXIS = TRANSFORM_ORIGIN_UNITS.filter((unit) => unit !== "%");
 var TRANSFORM_ORIGIN_FIELDS = [
   {
-    label: __47("Origin X", "elementor"),
+    label: __48("Origin X", "elementor"),
     bind: "x",
     units: TRANSFORM_ORIGIN_UNITS
   },
   {
-    label: __47("Origin Y", "elementor"),
+    label: __48("Origin Y", "elementor"),
     bind: "y",
     units: TRANSFORM_ORIGIN_UNITS
   },
   {
-    label: __47("Origin Z", "elementor"),
+    label: __48("Origin Z", "elementor"),
     bind: "z",
     units: TRANSFORM_ORIGIN_UNITS_Z_AXIS
   }
 ];
 var TransformOriginControl = () => {
-  return /* @__PURE__ */ React100.createElement(Stack16, { direction: "column", spacing: 1.5 }, /* @__PURE__ */ React100.createElement(ControlFormLabel, null, __47("Transform", "elementor")), TRANSFORM_ORIGIN_FIELDS.map((control) => /* @__PURE__ */ React100.createElement(ControlFields2, { control, key: control.bind })));
+  return /* @__PURE__ */ React102.createElement(Stack16, { direction: "column", spacing: 1.5 }, /* @__PURE__ */ React102.createElement(ControlFormLabel, null, __48("Transform", "elementor")), TRANSFORM_ORIGIN_FIELDS.map((control) => /* @__PURE__ */ React102.createElement(ControlFields2, { control, key: control.bind })));
 };
 var ControlFields2 = ({ control }) => {
   const context = useBoundProp(transformOriginPropTypeUtil);
   const rowRef = useRef23(null);
-  return /* @__PURE__ */ React100.createElement(PropProvider, { ...context }, /* @__PURE__ */ React100.createElement(PropKeyProvider, { bind: control.bind }, /* @__PURE__ */ React100.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React100.createElement(Grid27, { item: true, xs: 6 }, /* @__PURE__ */ React100.createElement(ControlFormLabel, null, control.label)), /* @__PURE__ */ React100.createElement(Grid27, { item: true, xs: 6 }, /* @__PURE__ */ React100.createElement(SizeControl, { variant: "length", units: control.units, anchorRef: rowRef })))));
+  return /* @__PURE__ */ React102.createElement(PropProvider, { ...context }, /* @__PURE__ */ React102.createElement(PropKeyProvider, { bind: control.bind }, /* @__PURE__ */ React102.createElement(PopoverGridContainer, { ref: rowRef }, /* @__PURE__ */ React102.createElement(Grid27, { item: true, xs: 6 }, /* @__PURE__ */ React102.createElement(ControlFormLabel, null, control.label)), /* @__PURE__ */ React102.createElement(Grid27, { item: true, xs: 6 }, /* @__PURE__ */ React102.createElement(SizeControl, { variant: "length", units: control.units, anchorRef: rowRef })))));
 };
 
 // src/controls/transform-control/transform-settings-control.tsx
-var SIZE9 = "tiny";
+var SIZE10 = "tiny";
 var TransformSettingsControl = ({
   popupState,
   anchorRef,
@@ -6611,7 +6729,7 @@ var TransformSettingsControl = ({
     ...popupState,
     anchorEl: anchorRef.current ?? void 0
   });
-  return /* @__PURE__ */ React101.createElement(
+  return /* @__PURE__ */ React103.createElement(
     Popover6,
     {
       disablePortal: true,
@@ -6626,45 +6744,45 @@ var TransformSettingsControl = ({
       },
       ...popupProps
     },
-    /* @__PURE__ */ React101.createElement(
+    /* @__PURE__ */ React103.createElement(
       PopoverHeader4,
       {
-        title: __48("Transform settings", "elementor"),
+        title: __49("Transform settings", "elementor"),
         onClose: popupState.close,
-        icon: /* @__PURE__ */ React101.createElement(AdjustmentsIcon, { fontSize: SIZE9 })
+        icon: /* @__PURE__ */ React103.createElement(AdjustmentsIcon, { fontSize: SIZE10 })
       }
     ),
-    /* @__PURE__ */ React101.createElement(Divider4, null),
-    /* @__PURE__ */ React101.createElement(PopoverContent, { sx: { px: 2, py: 1.5 } }, /* @__PURE__ */ React101.createElement(PropKeyProvider, { bind: "transform-origin" }, /* @__PURE__ */ React101.createElement(TransformOriginControl, null)), showChildrenPerspective && /* @__PURE__ */ React101.createElement(React101.Fragment, null, /* @__PURE__ */ React101.createElement(Box18, { sx: { my: 0.5 } }, /* @__PURE__ */ React101.createElement(Divider4, null)), /* @__PURE__ */ React101.createElement(ChildrenPerspectiveControl, null)))
+    /* @__PURE__ */ React103.createElement(Divider4, null),
+    /* @__PURE__ */ React103.createElement(PopoverContent, { sx: { px: 2, py: 1.5 } }, /* @__PURE__ */ React103.createElement(PropKeyProvider, { bind: "transform-origin" }, /* @__PURE__ */ React103.createElement(TransformOriginControl, null)), showChildrenPerspective && /* @__PURE__ */ React103.createElement(React103.Fragment, null, /* @__PURE__ */ React103.createElement(Box18, { sx: { my: 0.5 } }, /* @__PURE__ */ React103.createElement(Divider4, null)), /* @__PURE__ */ React103.createElement(ChildrenPerspectiveControl, null)))
   );
 };
 
 // src/controls/transform-control/transform-repeater-control.tsx
-var SIZE10 = "tiny";
+var SIZE11 = "tiny";
 var TransformRepeaterControl = createControl(
   ({ showChildrenPerspective }) => {
     const context = useBoundProp(transformPropTypeUtil);
     const headerRef = useRef24(null);
     const popupState = usePopupState8({ variant: "popover" });
-    return /* @__PURE__ */ React102.createElement(PropProvider, { ...context }, /* @__PURE__ */ React102.createElement(
+    return /* @__PURE__ */ React104.createElement(PropProvider, { ...context }, /* @__PURE__ */ React104.createElement(
       TransformSettingsControl,
       {
         popupState,
         anchorRef: headerRef,
         showChildrenPerspective
       }
-    ), /* @__PURE__ */ React102.createElement(PropKeyProvider, { bind: "transform-functions" }, /* @__PURE__ */ React102.createElement(Repeater2, { headerRef, propType: context.propType, popupState })));
+    ), /* @__PURE__ */ React104.createElement(PropKeyProvider, { bind: "transform-functions" }, /* @__PURE__ */ React104.createElement(Repeater2, { headerRef, propType: context.propType, popupState })));
   }
 );
-var ToolTip = /* @__PURE__ */ React102.createElement(
+var ToolTip = /* @__PURE__ */ React104.createElement(
   Box19,
   {
     component: "span",
     "aria-label": void 0,
     sx: { display: "flex", gap: 0.5, p: 2, width: 320, borderRadius: 1 }
   },
-  /* @__PURE__ */ React102.createElement(InfoCircleFilledIcon2, { sx: { color: "secondary.main" } }),
-  /* @__PURE__ */ React102.createElement(Typography7, { variant: "body2", color: "text.secondary", fontSize: "14px" }, __49("You can use each kind of transform only once per element.", "elementor"))
+  /* @__PURE__ */ React104.createElement(InfoCircleFilledIcon2, { sx: { color: "secondary.main" } }),
+  /* @__PURE__ */ React104.createElement(Typography7, { variant: "body2", color: "text.secondary", fontSize: "14px" }, __50("You can use each kind of transform only once per element.", "elementor"))
 );
 var Repeater2 = ({
   headerRef,
@@ -6678,21 +6796,21 @@ var Repeater2 = ({
     return availableValues.find((value) => !transformValues?.some((item) => item.$$type === value.$$type));
   };
   const shouldDisableAddItem = !getInitialValue2();
-  return /* @__PURE__ */ React102.createElement(PropProvider, { ...transformFunctionsContext }, /* @__PURE__ */ React102.createElement(
+  return /* @__PURE__ */ React104.createElement(PropProvider, { ...transformFunctionsContext }, /* @__PURE__ */ React104.createElement(
     ControlRepeater,
     {
       initial: getInitialValue2() ?? initialTransformValue,
       propTypeUtil: transformFunctionsPropTypeUtil
     },
-    /* @__PURE__ */ React102.createElement(
+    /* @__PURE__ */ React104.createElement(
       RepeaterHeader,
       {
-        label: __49("Transform", "elementor"),
-        adornment: () => /* @__PURE__ */ React102.createElement(ControlAdornments, { customContext: { path: ["transform"], propType } }),
+        label: __50("Transform", "elementor"),
+        adornment: () => /* @__PURE__ */ React104.createElement(ControlAdornments, { customContext: { path: ["transform"], propType } }),
         ref: headerRef
       },
-      /* @__PURE__ */ React102.createElement(TransformBasePopoverTrigger, { popupState, repeaterBindKey: bind }),
-      /* @__PURE__ */ React102.createElement(
+      /* @__PURE__ */ React104.createElement(TransformBasePopoverTrigger, { popupState, repeaterBindKey: bind }),
+      /* @__PURE__ */ React104.createElement(
         TooltipAddItemAction,
         {
           disabled: shouldDisableAddItem,
@@ -6702,15 +6820,15 @@ var Repeater2 = ({
         }
       )
     ),
-    /* @__PURE__ */ React102.createElement(ItemsContainer, null, /* @__PURE__ */ React102.createElement(
+    /* @__PURE__ */ React104.createElement(ItemsContainer, null, /* @__PURE__ */ React104.createElement(
       Item,
       {
         Icon: TransformIcon,
         Label: TransformLabel,
-        actions: /* @__PURE__ */ React102.createElement(React102.Fragment, null, /* @__PURE__ */ React102.createElement(DisableItemAction, null), /* @__PURE__ */ React102.createElement(RemoveItemAction, null))
+        actions: /* @__PURE__ */ React104.createElement(React104.Fragment, null, /* @__PURE__ */ React104.createElement(DisableItemAction, null), /* @__PURE__ */ React104.createElement(RemoveItemAction, null))
       }
     )),
-    /* @__PURE__ */ React102.createElement(EditItemPopover, null, /* @__PURE__ */ React102.createElement(TransformContent, null))
+    /* @__PURE__ */ React104.createElement(EditItemPopover, null, /* @__PURE__ */ React104.createElement(TransformContent, null))
   ));
 };
 var TransformBasePopoverTrigger = ({
@@ -6718,25 +6836,25 @@ var TransformBasePopoverTrigger = ({
   repeaterBindKey
 }) => {
   const { bind } = useBoundProp();
-  const titleLabel = __49("Transform settings", "elementor");
-  return bind !== repeaterBindKey ? null : /* @__PURE__ */ React102.createElement(Tooltip8, { title: titleLabel, placement: "top" }, /* @__PURE__ */ React102.createElement(IconButton7, { size: SIZE10, "aria-label": titleLabel, ...bindTrigger5(popupState) }, /* @__PURE__ */ React102.createElement(AdjustmentsIcon2, { fontSize: SIZE10 })));
+  const titleLabel = __50("Transform settings", "elementor");
+  return bind !== repeaterBindKey ? null : /* @__PURE__ */ React104.createElement(Tooltip8, { title: titleLabel, placement: "top" }, /* @__PURE__ */ React104.createElement(IconButton7, { size: SIZE11, "aria-label": titleLabel, ...bindTrigger5(popupState) }, /* @__PURE__ */ React104.createElement(AdjustmentsIcon2, { fontSize: SIZE11 })));
 };
 
 // src/controls/transition-control/transition-repeater-control.tsx
-import * as React105 from "react";
-import { useEffect as useEffect15, useMemo as useMemo15, useState as useState18 } from "react";
+import * as React107 from "react";
+import { useEffect as useEffect15, useMemo as useMemo16, useState as useState18 } from "react";
 import {
-  createArrayPropUtils as createArrayPropUtils2,
+  createArrayPropUtils as createArrayPropUtils3,
   selectionSizePropTypeUtil as selectionSizePropTypeUtil2
 } from "@elementor/editor-props";
 import { InfoCircleFilledIcon as InfoCircleFilledIcon3 } from "@elementor/icons";
 import { Alert as Alert2, AlertTitle as AlertTitle3, Box as Box21, Typography as Typography8 } from "@elementor/ui";
 import { hasProInstalled as hasProInstalled2 } from "@elementor/utils";
-import { __ as __52 } from "@wordpress/i18n";
+import { __ as __53 } from "@wordpress/i18n";
 
 // src/controls/selection-size-control.tsx
-import * as React103 from "react";
-import { useMemo as useMemo13, useRef as useRef25 } from "react";
+import * as React105 from "react";
+import { useMemo as useMemo14, useRef as useRef25 } from "react";
 import { selectionSizePropTypeUtil } from "@elementor/editor-props";
 import { Grid as Grid28 } from "@elementor/ui";
 var SelectionSizeControl = createControl(
@@ -6744,7 +6862,7 @@ var SelectionSizeControl = createControl(
     const { value, setValue, propType } = useBoundProp(selectionSizePropTypeUtil);
     const rowRef = useRef25(null);
     const sizeFieldId = sizeLabel.replace(/\s+/g, "-").toLowerCase();
-    const currentSizeConfig = useMemo13(() => {
+    const currentSizeConfig = useMemo14(() => {
       switch (value.selection.$$type) {
         case "key-value":
           return sizeConfigMap[value?.selection?.value.value.value || ""];
@@ -6755,7 +6873,7 @@ var SelectionSizeControl = createControl(
       }
     }, [value, sizeConfigMap]);
     const SelectionComponent = selectionConfig.component;
-    return /* @__PURE__ */ React103.createElement(PropProvider, { value, setValue, propType }, /* @__PURE__ */ React103.createElement(Grid28, { container: true, spacing: 1.5, ref: rowRef }, /* @__PURE__ */ React103.createElement(Grid28, { item: true, xs: 6, sx: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React103.createElement(ControlFormLabel, null, selectionLabel)), /* @__PURE__ */ React103.createElement(Grid28, { item: true, xs: 6 }, /* @__PURE__ */ React103.createElement(PropKeyProvider, { bind: "selection" }, /* @__PURE__ */ React103.createElement(SelectionComponent, { ...selectionConfig.props }))), currentSizeConfig && /* @__PURE__ */ React103.createElement(React103.Fragment, null, /* @__PURE__ */ React103.createElement(Grid28, { item: true, xs: 6, sx: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React103.createElement(ControlFormLabel, { htmlFor: sizeFieldId }, sizeLabel)), /* @__PURE__ */ React103.createElement(Grid28, { item: true, xs: 6 }, /* @__PURE__ */ React103.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React103.createElement(
+    return /* @__PURE__ */ React105.createElement(PropProvider, { value, setValue, propType }, /* @__PURE__ */ React105.createElement(Grid28, { container: true, spacing: 1.5, ref: rowRef }, /* @__PURE__ */ React105.createElement(Grid28, { item: true, xs: 6, sx: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React105.createElement(ControlFormLabel, null, selectionLabel)), /* @__PURE__ */ React105.createElement(Grid28, { item: true, xs: 6 }, /* @__PURE__ */ React105.createElement(PropKeyProvider, { bind: "selection" }, /* @__PURE__ */ React105.createElement(SelectionComponent, { ...selectionConfig.props }))), currentSizeConfig && /* @__PURE__ */ React105.createElement(React105.Fragment, null, /* @__PURE__ */ React105.createElement(Grid28, { item: true, xs: 6, sx: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React105.createElement(ControlFormLabel, { htmlFor: sizeFieldId }, sizeLabel)), /* @__PURE__ */ React105.createElement(Grid28, { item: true, xs: 6 }, /* @__PURE__ */ React105.createElement(PropKeyProvider, { bind: "size" }, /* @__PURE__ */ React105.createElement(
       SizeControl,
       {
         anchorRef: rowRef,
@@ -6770,12 +6888,12 @@ var SelectionSizeControl = createControl(
 
 // src/controls/transition-control/data.ts
 import { hasProInstalled, isVersionGreaterOrEqual } from "@elementor/utils";
-import { __ as __50 } from "@wordpress/i18n";
+import { __ as __51 } from "@wordpress/i18n";
 var initialTransitionValue = {
   selection: {
     $$type: "key-value",
     value: {
-      key: { value: __50("All properties", "elementor"), $$type: "string" },
+      key: { value: __51("All properties", "elementor"), $$type: "string" },
       value: { value: "all", $$type: "string" }
     }
   },
@@ -6799,128 +6917,128 @@ var createTransitionPropertiesList = () => {
   const isSiteRtl = getIsSiteRtl();
   const baseProperties = [
     {
-      label: __50("Default", "elementor"),
+      label: __51("Default", "elementor"),
       type: "category",
-      properties: [{ label: __50("All properties", "elementor"), value: "all" }]
+      properties: [{ label: __51("All properties", "elementor"), value: "all" }]
     },
     {
-      label: __50("Margin", "elementor"),
+      label: __51("Margin", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Margin (all)", "elementor"), value: "margin", isDisabled: true },
-        { label: __50("Margin bottom", "elementor"), value: "margin-block-end", isDisabled: true },
+        { label: __51("Margin (all)", "elementor"), value: "margin", isDisabled: true },
+        { label: __51("Margin bottom", "elementor"), value: "margin-block-end", isDisabled: true },
         {
-          label: isSiteRtl ? __50("Margin right", "elementor") : __50("Margin left", "elementor"),
+          label: isSiteRtl ? __51("Margin right", "elementor") : __51("Margin left", "elementor"),
           value: "margin-inline-start",
           isDisabled: true
         },
         {
-          label: isSiteRtl ? __50("Margin left", "elementor") : __50("Margin right", "elementor"),
+          label: isSiteRtl ? __51("Margin left", "elementor") : __51("Margin right", "elementor"),
           value: "margin-inline-end",
           isDisabled: true
         },
-        { label: __50("Margin top", "elementor"), value: "margin-block-start", isDisabled: true }
+        { label: __51("Margin top", "elementor"), value: "margin-block-start", isDisabled: true }
       ]
     },
     {
-      label: __50("Padding", "elementor"),
+      label: __51("Padding", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Padding (all)", "elementor"), value: "padding", isDisabled: true },
-        { label: __50("Padding bottom", "elementor"), value: "padding-block-end", isDisabled: true },
+        { label: __51("Padding (all)", "elementor"), value: "padding", isDisabled: true },
+        { label: __51("Padding bottom", "elementor"), value: "padding-block-end", isDisabled: true },
         {
-          label: isSiteRtl ? __50("Padding right", "elementor") : __50("Padding left", "elementor"),
+          label: isSiteRtl ? __51("Padding right", "elementor") : __51("Padding left", "elementor"),
           value: "padding-inline-start",
           isDisabled: true
         },
         {
-          label: isSiteRtl ? __50("Padding left", "elementor") : __50("Padding right", "elementor"),
+          label: isSiteRtl ? __51("Padding left", "elementor") : __51("Padding right", "elementor"),
           value: "padding-inline-end",
           isDisabled: true
         },
-        { label: __50("Padding top", "elementor"), value: "padding-block-start", isDisabled: true }
+        { label: __51("Padding top", "elementor"), value: "padding-block-start", isDisabled: true }
       ]
     },
     {
-      label: __50("Flex", "elementor"),
+      label: __51("Flex", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Flex (all)", "elementor"), value: "flex", isDisabled: true },
-        { label: __50("Flex grow", "elementor"), value: "flex-grow", isDisabled: true },
-        { label: __50("Flex shrink", "elementor"), value: "flex-shrink", isDisabled: true },
-        { label: __50("Flex basis", "elementor"), value: "flex-basis", isDisabled: true }
+        { label: __51("Flex (all)", "elementor"), value: "flex", isDisabled: true },
+        { label: __51("Flex grow", "elementor"), value: "flex-grow", isDisabled: true },
+        { label: __51("Flex shrink", "elementor"), value: "flex-shrink", isDisabled: true },
+        { label: __51("Flex basis", "elementor"), value: "flex-basis", isDisabled: true }
       ]
     },
     {
-      label: __50("Size", "elementor"),
+      label: __51("Size", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Width", "elementor"), value: "width", isDisabled: true },
-        { label: __50("Height", "elementor"), value: "height", isDisabled: true },
-        { label: __50("Max height", "elementor"), value: "max-height", isDisabled: true },
-        { label: __50("Max width", "elementor"), value: "max-width", isDisabled: true },
-        { label: __50("Min height", "elementor"), value: "min-height", isDisabled: true },
-        { label: __50("Min width", "elementor"), value: "min-width", isDisabled: true }
+        { label: __51("Width", "elementor"), value: "width", isDisabled: true },
+        { label: __51("Height", "elementor"), value: "height", isDisabled: true },
+        { label: __51("Max height", "elementor"), value: "max-height", isDisabled: true },
+        { label: __51("Max width", "elementor"), value: "max-width", isDisabled: true },
+        { label: __51("Min height", "elementor"), value: "min-height", isDisabled: true },
+        { label: __51("Min width", "elementor"), value: "min-width", isDisabled: true }
       ]
     },
     {
-      label: __50("Position", "elementor"),
+      label: __51("Position", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Top", "elementor"), value: "inset-block-start", isDisabled: true },
+        { label: __51("Top", "elementor"), value: "inset-block-start", isDisabled: true },
         {
-          label: isSiteRtl ? __50("Right", "elementor") : __50("Left", "elementor"),
+          label: isSiteRtl ? __51("Right", "elementor") : __51("Left", "elementor"),
           value: "inset-inline-start",
           isDisabled: true
         },
         {
-          label: isSiteRtl ? __50("Left", "elementor") : __50("Right", "elementor"),
+          label: isSiteRtl ? __51("Left", "elementor") : __51("Right", "elementor"),
           value: "inset-inline-end",
           isDisabled: true
         },
-        { label: __50("Bottom", "elementor"), value: "inset-block-end", isDisabled: true },
-        { label: __50("Z-index", "elementor"), value: "z-index", isDisabled: true }
+        { label: __51("Bottom", "elementor"), value: "inset-block-end", isDisabled: true },
+        { label: __51("Z-index", "elementor"), value: "z-index", isDisabled: true }
       ]
     },
     {
-      label: __50("Typography", "elementor"),
+      label: __51("Typography", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Font color", "elementor"), value: "color", isDisabled: true },
-        { label: __50("Font size", "elementor"), value: "font-size", isDisabled: true },
-        { label: __50("Line height", "elementor"), value: "line-height", isDisabled: true },
-        { label: __50("Letter spacing", "elementor"), value: "letter-spacing", isDisabled: true },
-        { label: __50("Word spacing", "elementor"), value: "word-spacing", isDisabled: true },
-        { label: __50("Font variations", "elementor"), value: "font-variation-settings", isDisabled: true },
-        { label: __50("Text stroke color", "elementor"), value: "-webkit-text-stroke-color", isDisabled: true }
+        { label: __51("Font color", "elementor"), value: "color", isDisabled: true },
+        { label: __51("Font size", "elementor"), value: "font-size", isDisabled: true },
+        { label: __51("Line height", "elementor"), value: "line-height", isDisabled: true },
+        { label: __51("Letter spacing", "elementor"), value: "letter-spacing", isDisabled: true },
+        { label: __51("Word spacing", "elementor"), value: "word-spacing", isDisabled: true },
+        { label: __51("Font variations", "elementor"), value: "font-variation-settings", isDisabled: true },
+        { label: __51("Text stroke color", "elementor"), value: "-webkit-text-stroke-color", isDisabled: true }
       ]
     },
     {
-      label: __50("Background", "elementor"),
+      label: __51("Background", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Background color", "elementor"), value: "background-color", isDisabled: true },
-        { label: __50("Background position", "elementor"), value: "background-position", isDisabled: true },
-        { label: __50("Box shadow", "elementor"), value: "box-shadow", isDisabled: true }
+        { label: __51("Background color", "elementor"), value: "background-color", isDisabled: true },
+        { label: __51("Background position", "elementor"), value: "background-position", isDisabled: true },
+        { label: __51("Box shadow", "elementor"), value: "box-shadow", isDisabled: true }
       ]
     },
     {
-      label: __50("Border", "elementor"),
+      label: __51("Border", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Border (all)", "elementor"), value: "border", isDisabled: true },
-        { label: __50("Border radius", "elementor"), value: "border-radius", isDisabled: true },
-        { label: __50("Border color", "elementor"), value: "border-color", isDisabled: true },
-        { label: __50("Border width", "elementor"), value: "border-width", isDisabled: true }
+        { label: __51("Border (all)", "elementor"), value: "border", isDisabled: true },
+        { label: __51("Border radius", "elementor"), value: "border-radius", isDisabled: true },
+        { label: __51("Border color", "elementor"), value: "border-color", isDisabled: true },
+        { label: __51("Border width", "elementor"), value: "border-width", isDisabled: true }
       ]
     },
     {
-      label: __50("Effects", "elementor"),
+      label: __51("Effects", "elementor"),
       type: "category",
       properties: [
-        { label: __50("Opacity", "elementor"), value: "opacity", isDisabled: true },
-        { label: __50("Transform (all)", "elementor"), value: "transform", isDisabled: true },
-        { label: __50("Filter (all)", "elementor"), value: "filter", isDisabled: true }
+        { label: __51("Opacity", "elementor"), value: "opacity", isDisabled: true },
+        { label: __51("Transform (all)", "elementor"), value: "transform", isDisabled: true },
+        { label: __51("Filter (all)", "elementor"), value: "filter", isDisabled: true }
       ]
     }
   ];
@@ -6956,13 +7074,13 @@ function subscribeToTransitionEvent() {
 }
 
 // src/controls/transition-control/transition-selector.tsx
-import * as React104 from "react";
-import { useMemo as useMemo14, useRef as useRef26 } from "react";
+import * as React106 from "react";
+import { useMemo as useMemo15, useRef as useRef26 } from "react";
 import { keyValuePropTypeUtil as keyValuePropTypeUtil2 } from "@elementor/editor-props";
 import { PromotionAlert, PromotionChip } from "@elementor/editor-ui";
 import { ChevronDownIcon as ChevronDownIcon3, VariationsIcon } from "@elementor/icons";
 import { bindPopover as bindPopover7, bindTrigger as bindTrigger6, Box as Box20, Popover as Popover7, UnstableTag as UnstableTag3, usePopupState as usePopupState9 } from "@elementor/ui";
-import { __ as __51 } from "@wordpress/i18n";
+import { __ as __52 } from "@wordpress/i18n";
 
 // src/utils/tracking.ts
 import { getSelectedElements as getSelectedElements2 } from "@elementor/editor-elements";
@@ -7046,7 +7164,7 @@ var TransitionSelector = ({
   } = value;
   const defaultRef = useRef26(null);
   const popoverState = usePopupState9({ variant: "popover" });
-  const disabledCategories = useMemo14(() => {
+  const disabledCategories = useMemo15(() => {
     return new Set(
       transitionProperties.filter((cat) => cat.properties.some((prop) => prop.isDisabled)).map((cat) => cat.label)
     );
@@ -7066,7 +7184,7 @@ var TransitionSelector = ({
     return [
       first,
       {
-        label: __51("Recently Used", "elementor"),
+        label: __52("Recently Used", "elementor"),
         items: recentItems
       },
       ...rest
@@ -7090,16 +7208,16 @@ var TransitionSelector = ({
       left: rect.right + 36
     };
   };
-  return /* @__PURE__ */ React104.createElement(Box20, { ref: defaultRef }, /* @__PURE__ */ React104.createElement(ControlActions, null, /* @__PURE__ */ React104.createElement(
+  return /* @__PURE__ */ React106.createElement(Box20, { ref: defaultRef }, /* @__PURE__ */ React106.createElement(ControlActions, null, /* @__PURE__ */ React106.createElement(
     UnstableTag3,
     {
       variant: "outlined",
       label: transitionLabel,
-      endIcon: /* @__PURE__ */ React104.createElement(ChevronDownIcon3, { fontSize: "tiny" }),
+      endIcon: /* @__PURE__ */ React106.createElement(ChevronDownIcon3, { fontSize: "tiny" }),
       ...bindTrigger6(popoverState),
       fullWidth: true
     }
-  )), /* @__PURE__ */ React104.createElement(
+  )), /* @__PURE__ */ React106.createElement(
     Popover7,
     {
       disablePortal: true,
@@ -7110,7 +7228,7 @@ var TransitionSelector = ({
       anchorOrigin: { vertical: "top", horizontal: "right" },
       transformOrigin: { vertical: "top", horizontal: "left" }
     },
-    /* @__PURE__ */ React104.createElement(
+    /* @__PURE__ */ React106.createElement(
       ItemSelector,
       {
         itemsList: getItemList(),
@@ -7118,10 +7236,10 @@ var TransitionSelector = ({
         onItemChange: handleTransitionPropertyChange,
         onClose: popoverState.close,
         sectionWidth: 268,
-        title: __51("Transition Property", "elementor"),
+        title: __52("Transition Property", "elementor"),
         icon: VariationsIcon,
         disabledItems: includeCurrentValueInOptions(value, disabledItems),
-        categoryItemContentTemplate: (item) => /* @__PURE__ */ React104.createElement(
+        categoryItemContentTemplate: (item) => /* @__PURE__ */ React106.createElement(
           Box20,
           {
             sx: {
@@ -7131,13 +7249,13 @@ var TransitionSelector = ({
               width: "100%"
             }
           },
-          /* @__PURE__ */ React104.createElement("span", null, item.value),
-          showPromotion && disabledCategories.has(item.value) && /* @__PURE__ */ React104.createElement(PromotionChip, null)
+          /* @__PURE__ */ React106.createElement("span", null, item.value),
+          showPromotion && disabledCategories.has(item.value) && /* @__PURE__ */ React106.createElement(PromotionChip, null)
         ),
-        footer: showPromotion ? /* @__PURE__ */ React104.createElement(
+        footer: showPromotion ? /* @__PURE__ */ React106.createElement(
           PromotionAlert,
           {
-            message: __51(
+            message: __52(
               "Upgrade to customize transition properties and control effects.",
               "elementor"
             ),
@@ -7159,7 +7277,7 @@ var DURATION_CONFIG = {
   units: ["s", "ms"],
   defaultUnit: "ms"
 };
-var childArrayPropTypeUtil = createArrayPropUtils2(
+var childArrayPropTypeUtil = createArrayPropUtils3(
   selectionSizePropTypeUtil2.key,
   selectionSizePropTypeUtil2.schema,
   "transition"
@@ -7176,8 +7294,8 @@ var areAllPropertiesUsed = (value = []) => {
 };
 var getSelectionSizeProps = (recentlyUsedList, disabledItems, showPromotion) => {
   return {
-    selectionLabel: __52("Type", "elementor"),
-    sizeLabel: __52("Duration", "elementor"),
+    selectionLabel: __53("Type", "elementor"),
+    sizeLabel: __53("Duration", "elementor"),
     selectionConfig: {
       component: TransitionSelector,
       props: {
@@ -7253,7 +7371,7 @@ var getInitialValue = (values = []) => {
   }
   return initialTransitionValue;
 };
-var disableAddItemTooltipContent = /* @__PURE__ */ React105.createElement(
+var disableAddItemTooltipContent = /* @__PURE__ */ React107.createElement(
   Alert2,
   {
     sx: {
@@ -7261,10 +7379,10 @@ var disableAddItemTooltipContent = /* @__PURE__ */ React105.createElement(
       gap: 0.5
     },
     color: "secondary",
-    icon: /* @__PURE__ */ React105.createElement(InfoCircleFilledIcon3, null)
+    icon: /* @__PURE__ */ React107.createElement(InfoCircleFilledIcon3, null)
   },
-  /* @__PURE__ */ React105.createElement(AlertTitle3, null, __52("Transitions", "elementor")),
-  /* @__PURE__ */ React105.createElement(Box21, { component: "span" }, /* @__PURE__ */ React105.createElement(Typography8, { variant: "body2" }, __52("Switch to 'Normal' state to add a transition.", "elementor")))
+  /* @__PURE__ */ React107.createElement(AlertTitle3, null, __53("Transitions", "elementor")),
+  /* @__PURE__ */ React107.createElement(Box21, { component: "span" }, /* @__PURE__ */ React107.createElement(Typography8, { variant: "body2" }, __53("Switch to 'Normal' state to add a transition.", "elementor")))
 );
 var TransitionRepeaterControl = createControl(
   ({
@@ -7275,11 +7393,11 @@ var TransitionRepeaterControl = createControl(
     const [recentlyUsedList, setRecentlyUsedList] = useState18([]);
     const proInstalled = hasProInstalled2();
     const { value, setValue } = useBoundProp(childArrayPropTypeUtil);
-    const { allDisabled: disabledItems, proDisabled: proDisabledItems } = useMemo15(
+    const { allDisabled: disabledItems, proDisabled: proDisabledItems } = useMemo16(
       () => getDisabledItemLabels(value),
       [value]
     );
-    const allowedTransitionSet = useMemo15(() => {
+    const allowedTransitionSet = useMemo16(() => {
       const set = /* @__PURE__ */ new Set();
       transitionProperties.forEach((category) => {
         category.properties.forEach((prop) => {
@@ -7305,15 +7423,15 @@ var TransitionRepeaterControl = createControl(
     useEffect15(() => {
       recentlyUsedListGetter().then(setRecentlyUsedList);
     }, [recentlyUsedListGetter]);
-    const allPropertiesUsed = useMemo15(() => areAllPropertiesUsed(value), [value]);
+    const allPropertiesUsed = useMemo16(() => areAllPropertiesUsed(value), [value]);
     const isAddItemDisabled = !currentStyleIsNormal || allPropertiesUsed;
-    return /* @__PURE__ */ React105.createElement(
+    return /* @__PURE__ */ React107.createElement(
       RepeatableControl,
       {
-        label: __52("Transitions", "elementor"),
-        repeaterLabel: __52("Transitions", "elementor"),
+        label: __53("Transitions", "elementor"),
+        repeaterLabel: __53("Transitions", "elementor"),
         patternLabel: "${value.selection.value.key.value}: ${value.size.value.size}${value.size.value.unit}",
-        placeholder: __52("Empty Transition", "elementor"),
+        placeholder: __53("Empty Transition", "elementor"),
         showDuplicate: false,
         showToggle: true,
         initialValues: getInitialValue(value),
@@ -7334,9 +7452,9 @@ var TransitionRepeaterControl = createControl(
 );
 
 // src/controls/date-time-control.tsx
-import * as React106 from "react";
+import * as React108 from "react";
 import * as dayjs from "dayjs";
-import { isTransformable as isTransformable2, stringPropTypeUtil as stringPropTypeUtil17 } from "@elementor/editor-props";
+import { isTransformable as isTransformable2, stringPropTypeUtil as stringPropTypeUtil19 } from "@elementor/editor-props";
 import { DateTimePropTypeUtil } from "@elementor/editor-props";
 import { Box as Box22, DatePicker, LocalizationProvider, TimePicker } from "@elementor/ui";
 var DATE_FORMAT = "YYYY-MM-DD";
@@ -7382,10 +7500,10 @@ var DateTimeControl = createControl(({ inputDisabled }) => {
     const base = dayjs.default();
     return base.hour(h).minute(m).second(0).millisecond(0);
   };
-  return /* @__PURE__ */ React106.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React106.createElement(ControlActions, null, /* @__PURE__ */ React106.createElement(LocalizationProvider, null, /* @__PURE__ */ React106.createElement(Box22, { display: "flex", gap: 1, alignItems: "center" }, /* @__PURE__ */ React106.createElement(PropKeyProvider, { bind: "date" }, /* @__PURE__ */ React106.createElement(
+  return /* @__PURE__ */ React108.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React108.createElement(ControlActions, null, /* @__PURE__ */ React108.createElement(LocalizationProvider, null, /* @__PURE__ */ React108.createElement(Box22, { display: "flex", gap: 1, alignItems: "center" }, /* @__PURE__ */ React108.createElement(PropKeyProvider, { bind: "date" }, /* @__PURE__ */ React108.createElement(
     DatePicker,
     {
-      value: parseDateValue(stringPropTypeUtil17.extract(value?.date)),
+      value: parseDateValue(stringPropTypeUtil19.extract(value?.date)),
       onChange: (v) => handleChange({ date: v }, { bind: "date" }),
       disabled: inputDisabled,
       slotProps: {
@@ -7394,10 +7512,10 @@ var DateTimeControl = createControl(({ inputDisabled }) => {
         openPickerIcon: { fontSize: "tiny" }
       }
     }
-  )), /* @__PURE__ */ React106.createElement(PropKeyProvider, { bind: "time" }, /* @__PURE__ */ React106.createElement(
+  )), /* @__PURE__ */ React108.createElement(PropKeyProvider, { bind: "time" }, /* @__PURE__ */ React108.createElement(
     TimePicker,
     {
-      value: parseTimeValue(stringPropTypeUtil17.extract(value?.time)),
+      value: parseTimeValue(stringPropTypeUtil19.extract(value?.time)),
       onChange: (v) => handleChange({ time: v }, { bind: "time" }),
       disabled: inputDisabled,
       slotProps: {
@@ -7410,13 +7528,13 @@ var DateTimeControl = createControl(({ inputDisabled }) => {
 });
 
 // src/controls/date-range-control.tsx
-import * as React108 from "react";
+import * as React110 from "react";
 import { dateRangePropTypeUtil, dateStringPropTypeUtil as dateStringPropTypeUtil2 } from "@elementor/editor-props";
 import { FormHelperText as FormHelperText2, Grid as Grid29, Stack as Stack17 } from "@elementor/ui";
-import { __ as __53 } from "@wordpress/i18n";
+import { __ as __54 } from "@wordpress/i18n";
 
 // src/controls/date-string-control.tsx
-import * as React107 from "react";
+import * as React109 from "react";
 import { dateStringPropTypeUtil } from "@elementor/editor-props";
 import { DatePicker as DatePicker2, LocalizationProvider as LocalizationProvider2 } from "@elementor/ui";
 
@@ -7475,7 +7593,7 @@ var DateStringControl = createControl(
       }
       setValue(newValue.format(format));
     };
-    return /* @__PURE__ */ React107.createElement(LocalizationProvider2, null, /* @__PURE__ */ React107.createElement(ControlActions, null, /* @__PURE__ */ React107.createElement(
+    return /* @__PURE__ */ React109.createElement(LocalizationProvider2, null, /* @__PURE__ */ React109.createElement(ControlActions, null, /* @__PURE__ */ React109.createElement(
       DatePicker2,
       {
         value: parseDateString(value ?? ""),
@@ -7489,8 +7607,8 @@ var DateStringControl = createControl(
 
 // src/controls/date-range-control.tsx
 var RANGE_LABELS = {
-  min: __53("Min date", "elementor"),
-  max: __53("Max date", "elementor")
+  min: __54("Min date", "elementor"),
+  max: __54("Max date", "elementor")
 };
 var isMaxBeforeMin = (minIso, maxIso) => {
   if (!minIso || !maxIso) {
@@ -7498,38 +7616,38 @@ var isMaxBeforeMin = (minIso, maxIso) => {
   }
   return maxIso < minIso;
 };
-var RANGE_ERROR_MESSAGE = __53("Max date must be on or after Min date", "elementor");
+var RANGE_ERROR_MESSAGE = __54("Max date must be on or after Min date", "elementor");
 var DateRangeControl = createControl(() => {
   const { value, setValue, ...propContext } = useBoundProp(dateRangePropTypeUtil);
   const minString = dateStringPropTypeUtil2.extract(value?.min);
   const maxString = dateStringPropTypeUtil2.extract(value?.max);
   const hasInvalidRange = isMaxBeforeMin(minString, maxString);
-  return /* @__PURE__ */ React108.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React108.createElement(Stack17, { gap: 0.75 }, /* @__PURE__ */ React108.createElement(Stack17, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React108.createElement(Grid29, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React108.createElement(Grid29, { item: true, xs: 12 }, /* @__PURE__ */ React108.createElement(ControlFormLabel, null, RANGE_LABELS.min)), /* @__PURE__ */ React108.createElement(Grid29, { item: true, xs: 12 }, /* @__PURE__ */ React108.createElement(
+  return /* @__PURE__ */ React110.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React110.createElement(Stack17, { gap: 0.75 }, /* @__PURE__ */ React110.createElement(Stack17, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React110.createElement(Grid29, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React110.createElement(Grid29, { item: true, xs: 12 }, /* @__PURE__ */ React110.createElement(ControlFormLabel, null, RANGE_LABELS.min)), /* @__PURE__ */ React110.createElement(Grid29, { item: true, xs: 12 }, /* @__PURE__ */ React110.createElement(
     BoundDateStringControl,
     {
       bind: "min",
       ariaLabel: RANGE_LABELS.min,
       error: hasInvalidRange
     }
-  ))), /* @__PURE__ */ React108.createElement(Grid29, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React108.createElement(Grid29, { item: true, xs: 12 }, /* @__PURE__ */ React108.createElement(ControlFormLabel, null, RANGE_LABELS.max)), /* @__PURE__ */ React108.createElement(Grid29, { item: true, xs: 12 }, /* @__PURE__ */ React108.createElement(
+  ))), /* @__PURE__ */ React110.createElement(Grid29, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React110.createElement(Grid29, { item: true, xs: 12 }, /* @__PURE__ */ React110.createElement(ControlFormLabel, null, RANGE_LABELS.max)), /* @__PURE__ */ React110.createElement(Grid29, { item: true, xs: 12 }, /* @__PURE__ */ React110.createElement(
     BoundDateStringControl,
     {
       bind: "max",
       ariaLabel: RANGE_LABELS.max,
       error: hasInvalidRange
     }
-  )))), hasInvalidRange && /* @__PURE__ */ React108.createElement(FormHelperText2, { error: true }, RANGE_ERROR_MESSAGE)));
+  )))), hasInvalidRange && /* @__PURE__ */ React110.createElement(FormHelperText2, { error: true }, RANGE_ERROR_MESSAGE)));
 });
 var BoundDateStringControl = ({
   bind,
   ariaLabel,
   error
 }) => {
-  return /* @__PURE__ */ React108.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React108.createElement(DateStringControl, { ariaLabel, error, coerceInvalidToNull: true }));
+  return /* @__PURE__ */ React110.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React110.createElement(DateStringControl, { ariaLabel, error, coerceInvalidToNull: true }));
 };
 
 // src/controls/time-string-control.tsx
-import * as React109 from "react";
+import * as React111 from "react";
 import { timeStringPropTypeUtil } from "@elementor/editor-props";
 import { LocalizationProvider as LocalizationProvider3, TimePicker as TimePicker2 } from "@elementor/ui";
 var TimeStringControl = createControl(
@@ -7557,7 +7675,7 @@ var TimeStringControl = createControl(
       }
       setValue(newValue.format(format));
     };
-    return /* @__PURE__ */ React109.createElement(LocalizationProvider3, null, /* @__PURE__ */ React109.createElement(ControlActions, null, /* @__PURE__ */ React109.createElement(
+    return /* @__PURE__ */ React111.createElement(LocalizationProvider3, null, /* @__PURE__ */ React111.createElement(ControlActions, null, /* @__PURE__ */ React111.createElement(
       TimePicker2,
       {
         value: parseTimeString(value ?? ""),
@@ -7570,31 +7688,31 @@ var TimeStringControl = createControl(
 );
 
 // src/controls/time-range-control.tsx
-import * as React110 from "react";
+import * as React112 from "react";
 import { timeRangePropTypeUtil } from "@elementor/editor-props";
 import { Grid as Grid30, Stack as Stack18 } from "@elementor/ui";
-import { __ as __54 } from "@wordpress/i18n";
+import { __ as __55 } from "@wordpress/i18n";
 var RANGE_LABELS2 = {
-  min: __54("Start time", "elementor"),
-  max: __54("End time", "elementor")
+  min: __55("Start time", "elementor"),
+  max: __55("End time", "elementor")
 };
 var TimeRangeControl = createControl(() => {
   const { value, setValue, ...propContext } = useBoundProp(timeRangePropTypeUtil);
-  return /* @__PURE__ */ React110.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React110.createElement(Stack18, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React110.createElement(Grid30, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React110.createElement(Grid30, { item: true, xs: 12 }, /* @__PURE__ */ React110.createElement(ControlFormLabel, null, RANGE_LABELS2.min)), /* @__PURE__ */ React110.createElement(Grid30, { item: true, xs: 12 }, /* @__PURE__ */ React110.createElement(BoundTimeStringControl, { bind: "min", ariaLabel: RANGE_LABELS2.min }))), /* @__PURE__ */ React110.createElement(Grid30, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React110.createElement(Grid30, { item: true, xs: 12 }, /* @__PURE__ */ React110.createElement(ControlFormLabel, null, RANGE_LABELS2.max)), /* @__PURE__ */ React110.createElement(Grid30, { item: true, xs: 12 }, /* @__PURE__ */ React110.createElement(BoundTimeStringControl, { bind: "max", ariaLabel: RANGE_LABELS2.max })))));
+  return /* @__PURE__ */ React112.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React112.createElement(Stack18, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React112.createElement(Grid30, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React112.createElement(Grid30, { item: true, xs: 12 }, /* @__PURE__ */ React112.createElement(ControlFormLabel, null, RANGE_LABELS2.min)), /* @__PURE__ */ React112.createElement(Grid30, { item: true, xs: 12 }, /* @__PURE__ */ React112.createElement(BoundTimeStringControl, { bind: "min", ariaLabel: RANGE_LABELS2.min }))), /* @__PURE__ */ React112.createElement(Grid30, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React112.createElement(Grid30, { item: true, xs: 12 }, /* @__PURE__ */ React112.createElement(ControlFormLabel, null, RANGE_LABELS2.max)), /* @__PURE__ */ React112.createElement(Grid30, { item: true, xs: 12 }, /* @__PURE__ */ React112.createElement(BoundTimeStringControl, { bind: "max", ariaLabel: RANGE_LABELS2.max })))));
 });
 var BoundTimeStringControl = ({ bind, ariaLabel }) => {
-  return /* @__PURE__ */ React110.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React110.createElement(TimeStringControl, { ariaLabel, coerceInvalidToNull: true }));
+  return /* @__PURE__ */ React112.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React112.createElement(TimeStringControl, { ariaLabel, coerceInvalidToNull: true }));
 };
 
 // src/controls/inline-editing-control.tsx
-import * as React112 from "react";
-import { useCallback as useCallback4, useEffect as useEffect17, useMemo as useMemo16 } from "react";
-import { htmlV3PropTypeUtil, parseHtmlChildren, stringPropTypeUtil as stringPropTypeUtil18 } from "@elementor/editor-props";
+import * as React114 from "react";
+import { useCallback as useCallback4, useEffect as useEffect17, useMemo as useMemo17 } from "react";
+import { htmlV3PropTypeUtil, parseHtmlChildren, stringPropTypeUtil as stringPropTypeUtil20 } from "@elementor/editor-props";
 import { Box as Box24 } from "@elementor/ui";
 import { debounce as debounce4 } from "@elementor/utils";
 
 // src/components/inline-editor.tsx
-import * as React111 from "react";
+import * as React113 from "react";
 import { useEffect as useEffect16, useRef as useRef27 } from "react";
 import { Box as Box23 } from "@elementor/ui";
 import Bold from "@tiptap/extension-bold";
@@ -7633,7 +7751,7 @@ function htmlToPlainText(html) {
 var ITALIC_KEYBOARD_SHORTCUT = "i";
 var BOLD_KEYBOARD_SHORTCUT = "b";
 var UNDERLINE_KEYBOARD_SHORTCUT = "u";
-var InlineEditor = React111.forwardRef((props, ref) => {
+var InlineEditor = React113.forwardRef((props, ref) => {
   const {
     value,
     setValue,
@@ -7744,7 +7862,7 @@ var InlineEditor = React111.forwardRef((props, ref) => {
   if (mountElement) {
     return null;
   }
-  return /* @__PURE__ */ React111.createElement(Box23, { ref: containerRef, sx, className: wrapperClassName }, /* @__PURE__ */ React111.createElement(EditorContent, { ref, editor }));
+  return /* @__PURE__ */ React113.createElement(Box23, { ref: containerRef, sx, className: wrapperClassName }, /* @__PURE__ */ React113.createElement(EditorContent, { ref, editor }));
 });
 var useOnUpdate = (callback, dependencies) => {
   const hasMounted = useRef27(false);
@@ -7766,12 +7884,12 @@ var InlineEditingControl = createControl(
     props
   }) => {
     const { value, setValue, placeholder } = useBoundProp(htmlV3PropTypeUtil);
-    const content = stringPropTypeUtil18.extract(value?.content ?? null) ?? "";
-    const debouncedParse = useMemo16(
+    const content = stringPropTypeUtil20.extract(value?.content ?? null) ?? "";
+    const debouncedParse = useMemo17(
       () => debounce4((html) => {
         const parsed = parseHtmlChildren(html);
         setValue({
-          content: parsed.content ? stringPropTypeUtil18.create(parsed.content) : null,
+          content: parsed.content ? stringPropTypeUtil20.create(parsed.content) : null,
           children: parsed.children
         });
       }, CHILDREN_PARSE_DEBOUNCE_MS),
@@ -7781,7 +7899,7 @@ var InlineEditingControl = createControl(
       (newValue) => {
         const html = newValue ?? "";
         setValue({
-          content: html ? stringPropTypeUtil18.create(html) : null,
+          content: html ? stringPropTypeUtil20.create(html) : null,
           children: value?.children ?? []
         });
         debouncedParse(html);
@@ -7789,7 +7907,7 @@ var InlineEditingControl = createControl(
       [setValue, value?.children, debouncedParse]
     );
     useEffect17(() => () => debouncedParse.cancel(), [debouncedParse]);
-    return /* @__PURE__ */ React112.createElement(ControlActions, null, /* @__PURE__ */ React112.createElement(
+    return /* @__PURE__ */ React114.createElement(ControlActions, null, /* @__PURE__ */ React114.createElement(
       Box24,
       {
         sx: {
@@ -7834,7 +7952,7 @@ var InlineEditingControl = createControl(
         ...attributes,
         ...props
       },
-      /* @__PURE__ */ React112.createElement(
+      /* @__PURE__ */ React114.createElement(
         InlineEditor,
         {
           value: content,
@@ -7847,12 +7965,12 @@ var InlineEditingControl = createControl(
 );
 
 // src/controls/email-form-action-control.tsx
-import * as React113 from "react";
+import * as React115 from "react";
 import { emailPropTypeUtil } from "@elementor/editor-props";
 import { CollapsibleContent, InfoAlert as InfoAlert2 } from "@elementor/editor-ui";
 import { Box as Box25, Divider as Divider5, Grid as Grid31, Stack as Stack19 } from "@elementor/ui";
 import { hasProInstalled as hasProInstalled3, isVersionGreaterOrEqual as isVersionGreaterOrEqual2 } from "@elementor/utils";
-import { __ as __55 } from "@wordpress/i18n";
+import { __ as __56 } from "@wordpress/i18n";
 
 // src/hooks/use-form-field-suggestions.ts
 import { getContainer, getSelectedElements as getSelectedElements3 } from "@elementor/editor-elements";
@@ -7911,14 +8029,14 @@ function useFormFieldSuggestions(options) {
 }
 
 // src/controls/email-form-action-control.tsx
-var EmailField = ({ bind, label, placeholder }) => /* @__PURE__ */ React113.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React113.createElement(Grid31, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(TextControl, { placeholder }))));
-var SendToField = ({ placeholder }) => /* @__PURE__ */ React113.createElement(EmailField, { bind: "to", label: __55("Send to", "elementor"), placeholder });
-var SubjectField = () => /* @__PURE__ */ React113.createElement(
+var EmailField = ({ bind, label, placeholder }) => /* @__PURE__ */ React115.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React115.createElement(Grid31, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(TextControl, { placeholder }))));
+var SendToField = ({ placeholder }) => /* @__PURE__ */ React115.createElement(EmailField, { bind: "to", label: __56("Send to", "elementor"), placeholder });
+var SubjectField = () => /* @__PURE__ */ React115.createElement(
   EmailField,
   {
     bind: "subject",
-    label: __55("Email subject", "elementor"),
-    placeholder: __55("New form submission", "elementor")
+    label: __56("Email subject", "elementor"),
+    placeholder: __56("New form submission", "elementor")
   }
 );
 var MIN_PRO_VERSION_FOR_MENTIONS = "4.1.0";
@@ -7934,89 +8052,89 @@ var shouldShowMentionsInfo = () => {
 };
 var MessageField = () => {
   const suggestions = useFormFieldSuggestions();
-  return /* @__PURE__ */ React113.createElement(PropKeyProvider, { bind: "message" }, /* @__PURE__ */ React113.createElement(Grid31, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(ControlFormLabel, null, __55("Message", "elementor"))), /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(MentionTextAreaControl, { suggestions })), /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(InfoAlert2, null, shouldShowMentionsInfo() ? __55(
+  return /* @__PURE__ */ React115.createElement(PropKeyProvider, { bind: "message" }, /* @__PURE__ */ React115.createElement(Grid31, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(ControlFormLabel, null, __56("Message", "elementor"))), /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(MentionTextAreaControl, { suggestions })), /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(InfoAlert2, null, shouldShowMentionsInfo() ? __56(
     "[all-fields] shortcode sends all fields. Type @ to insert specific fields and customize your message.",
     "elementor"
-  ) : __55("[all-fields] shortcode sends all fields.", "elementor")))));
+  ) : __56("[all-fields] shortcode sends all fields.", "elementor")))));
 };
-var FromEmailField = () => /* @__PURE__ */ React113.createElement(
+var FromEmailField = () => /* @__PURE__ */ React115.createElement(
   EmailField,
   {
     bind: "from",
-    label: __55("From email", "elementor"),
-    placeholder: __55("What email should appear as the sender?", "elementor")
+    label: __56("From email", "elementor"),
+    placeholder: __56("What email should appear as the sender?", "elementor")
   }
 );
-var FromNameField = () => /* @__PURE__ */ React113.createElement(
+var FromNameField = () => /* @__PURE__ */ React115.createElement(
   EmailField,
   {
     bind: "from-name",
-    label: __55("From name", "elementor"),
-    placeholder: __55("What name should appear as the sender?", "elementor")
+    label: __56("From name", "elementor"),
+    placeholder: __56("What name should appear as the sender?", "elementor")
   }
 );
 var ReplyToField = () => {
   const emailSuggestions = useFormFieldSuggestions({ inputType: "email" });
-  return /* @__PURE__ */ React113.createElement(PropKeyProvider, { bind: "reply-to" }, /* @__PURE__ */ React113.createElement(Grid31, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(ControlFormLabel, null, __55("Reply-to", "elementor"))), /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(
+  return /* @__PURE__ */ React115.createElement(PropKeyProvider, { bind: "reply-to" }, /* @__PURE__ */ React115.createElement(Grid31, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(ControlFormLabel, null, __56("Reply-to", "elementor"))), /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(
     MentionTextAreaControl,
     {
       suggestions: emailSuggestions,
       rows: 1,
       triggerPosition: "start",
-      placeholder: __55("You can type @ to insert an email field", "elementor")
+      placeholder: __56("You can type @ to insert an email field", "elementor")
     }
   ))));
 };
-var CcField = () => /* @__PURE__ */ React113.createElement(EmailField, { bind: "cc", label: __55("Cc", "elementor") });
-var BccField = () => /* @__PURE__ */ React113.createElement(EmailField, { bind: "bcc", label: __55("Bcc", "elementor") });
-var MetaDataField = () => /* @__PURE__ */ React113.createElement(PropKeyProvider, { bind: "meta-data" }, /* @__PURE__ */ React113.createElement(Stack19, { gap: 0.5 }, /* @__PURE__ */ React113.createElement(ControlFormLabel, null, __55("Metadata", "elementor")), /* @__PURE__ */ React113.createElement(
+var CcField = () => /* @__PURE__ */ React115.createElement(EmailField, { bind: "cc", label: __56("Cc", "elementor") });
+var BccField = () => /* @__PURE__ */ React115.createElement(EmailField, { bind: "bcc", label: __56("Bcc", "elementor") });
+var MetaDataField = () => /* @__PURE__ */ React115.createElement(PropKeyProvider, { bind: "meta-data" }, /* @__PURE__ */ React115.createElement(Stack19, { gap: 0.5 }, /* @__PURE__ */ React115.createElement(ControlFormLabel, null, __56("Metadata", "elementor")), /* @__PURE__ */ React115.createElement(
   ChipsControl,
   {
     options: [
-      { label: __55("Date", "elementor"), value: "date" },
-      { label: __55("Time", "elementor"), value: "time" },
-      { label: __55("Page URL", "elementor"), value: "page-url" },
-      { label: __55("User agent", "elementor"), value: "user-agent" },
-      { label: __55("Credit", "elementor"), value: "credit" }
+      { label: __56("Date", "elementor"), value: "date" },
+      { label: __56("Time", "elementor"), value: "time" },
+      { label: __56("Page URL", "elementor"), value: "page-url" },
+      { label: __56("User agent", "elementor"), value: "user-agent" },
+      { label: __56("Credit", "elementor"), value: "credit" }
     ]
   }
 )));
-var SendAsField = () => /* @__PURE__ */ React113.createElement(PropKeyProvider, { bind: "send-as" }, /* @__PURE__ */ React113.createElement(Grid31, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(ControlFormLabel, null, __55("Send as", "elementor"))), /* @__PURE__ */ React113.createElement(Grid31, { item: true }, /* @__PURE__ */ React113.createElement(
+var SendAsField = () => /* @__PURE__ */ React115.createElement(PropKeyProvider, { bind: "send-as" }, /* @__PURE__ */ React115.createElement(Grid31, { container: true, direction: "column", gap: 0.5 }, /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(ControlFormLabel, null, __56("Send as", "elementor"))), /* @__PURE__ */ React115.createElement(Grid31, { item: true }, /* @__PURE__ */ React115.createElement(
   SelectControl,
   {
     options: [
-      { label: __55("HTML", "elementor"), value: "html" },
-      { label: __55("Plain Text", "elementor"), value: "plain" }
+      { label: __56("HTML", "elementor"), value: "html" },
+      { label: __56("Plain Text", "elementor"), value: "plain" }
     ]
   }
 ))));
-var AdvancedSettings = () => /* @__PURE__ */ React113.createElement(CollapsibleContent, { defaultOpen: false }, /* @__PURE__ */ React113.createElement(Box25, { sx: { pt: 2 } }, /* @__PURE__ */ React113.createElement(Stack19, { gap: 2 }, /* @__PURE__ */ React113.createElement(FromNameField, null), /* @__PURE__ */ React113.createElement(ReplyToField, null), /* @__PURE__ */ React113.createElement(CcField, null), /* @__PURE__ */ React113.createElement(BccField, null), /* @__PURE__ */ React113.createElement(Divider5, null), /* @__PURE__ */ React113.createElement(MetaDataField, null), /* @__PURE__ */ React113.createElement(SendAsField, null))));
+var AdvancedSettings = () => /* @__PURE__ */ React115.createElement(CollapsibleContent, { defaultOpen: false }, /* @__PURE__ */ React115.createElement(Box25, { sx: { pt: 2 } }, /* @__PURE__ */ React115.createElement(Stack19, { gap: 2 }, /* @__PURE__ */ React115.createElement(FromNameField, null), /* @__PURE__ */ React115.createElement(ReplyToField, null), /* @__PURE__ */ React115.createElement(CcField, null), /* @__PURE__ */ React115.createElement(BccField, null), /* @__PURE__ */ React115.createElement(Divider5, null), /* @__PURE__ */ React115.createElement(MetaDataField, null), /* @__PURE__ */ React115.createElement(SendAsField, null))));
 var EmailFormActionControl = createControl(({ toPlaceholder }) => {
   const { value, setValue, ...propContext } = useBoundProp(emailPropTypeUtil);
-  return /* @__PURE__ */ React113.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React113.createElement(Stack19, { gap: 2 }, /* @__PURE__ */ React113.createElement(ControlLabel, null, __55("Email settings", "elementor")), /* @__PURE__ */ React113.createElement(SendToField, { placeholder: toPlaceholder }), /* @__PURE__ */ React113.createElement(SubjectField, null), /* @__PURE__ */ React113.createElement(MessageField, null), /* @__PURE__ */ React113.createElement(FromEmailField, null), /* @__PURE__ */ React113.createElement(AdvancedSettings, null)));
+  return /* @__PURE__ */ React115.createElement(PropProvider, { ...propContext, value, setValue }, /* @__PURE__ */ React115.createElement(Stack19, { gap: 2 }, /* @__PURE__ */ React115.createElement(ControlLabel, null, __56("Email settings", "elementor")), /* @__PURE__ */ React115.createElement(SendToField, { placeholder: toPlaceholder }), /* @__PURE__ */ React115.createElement(SubjectField, null), /* @__PURE__ */ React115.createElement(MessageField, null), /* @__PURE__ */ React115.createElement(FromEmailField, null), /* @__PURE__ */ React115.createElement(AdvancedSettings, null)));
 });
 
 // src/controls/attachment-type-control.tsx
-import * as React114 from "react";
+import * as React116 from "react";
 import { InfoAlert as InfoAlert3 } from "@elementor/editor-ui";
 import { Grid as Grid32 } from "@elementor/ui";
-import { __ as __56 } from "@wordpress/i18n";
+import { __ as __57 } from "@wordpress/i18n";
 var AttachmentTypeControl = createControl(({ label, options }) => {
-  return /* @__PURE__ */ React114.createElement(Grid32, { container: true, direction: "column", gap: 1 }, label && /* @__PURE__ */ React114.createElement(Grid32, { item: true }, /* @__PURE__ */ React114.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React114.createElement(Grid32, { item: true }, /* @__PURE__ */ React114.createElement(SelectControl, { options })), /* @__PURE__ */ React114.createElement(Grid32, { item: true }, /* @__PURE__ */ React114.createElement(InfoAlert3, null, __56(
+  return /* @__PURE__ */ React116.createElement(Grid32, { container: true, direction: "column", gap: 1 }, label && /* @__PURE__ */ React116.createElement(Grid32, { item: true }, /* @__PURE__ */ React116.createElement(ControlFormLabel, null, label)), /* @__PURE__ */ React116.createElement(Grid32, { item: true }, /* @__PURE__ */ React116.createElement(SelectControl, { options })), /* @__PURE__ */ React116.createElement(Grid32, { item: true }, /* @__PURE__ */ React116.createElement(InfoAlert3, null, __57(
     "Linked uploads are saved to the server. Direct attachments will not appear under Submissions.",
     "elementor"
   ))));
 });
 
 // src/components/promotions/display-conditions-control.tsx
-import * as React116 from "react";
+import * as React118 from "react";
 import { useRef as useRef28 } from "react";
 import { SitemapIcon } from "@elementor/icons";
 import { IconButton as IconButton8, Stack as Stack20, Tooltip as Tooltip9 } from "@elementor/ui";
-import { __ as __57 } from "@wordpress/i18n";
+import { __ as __58 } from "@wordpress/i18n";
 
 // src/components/promotions/promotion-trigger.tsx
-import * as React115 from "react";
+import * as React117 from "react";
 import { forwardRef as forwardRef12, useCallback as useCallback5, useImperativeHandle, useState as useState19 } from "react";
 import { PromotionChip as PromotionChip2, PromotionInfotip } from "@elementor/editor-ui";
 import { Box as Box26 } from "@elementor/ui";
@@ -8036,7 +8154,7 @@ var PromotionTrigger = forwardRef12(
       });
     }, [trackingData]);
     useImperativeHandle(ref, () => ({ toggle }), [toggle]);
-    return /* @__PURE__ */ React115.createElement(React115.Fragment, null, promotion && /* @__PURE__ */ React115.createElement(
+    return /* @__PURE__ */ React117.createElement(React117.Fragment, null, promotion && /* @__PURE__ */ React117.createElement(
       PromotionInfotip,
       {
         title: promotion.title,
@@ -8050,7 +8168,7 @@ var PromotionTrigger = forwardRef12(
         },
         onCtaClick: () => trackUpgradePromotionClick(trackingData)
       },
-      /* @__PURE__ */ React115.createElement(
+      /* @__PURE__ */ React117.createElement(
         Box26,
         {
           onClick: (e) => {
@@ -8059,18 +8177,18 @@ var PromotionTrigger = forwardRef12(
           },
           sx: { cursor: "pointer", display: "inline-flex" }
         },
-        children ?? /* @__PURE__ */ React115.createElement(PromotionChip2, null)
+        children ?? /* @__PURE__ */ React117.createElement(PromotionChip2, null)
       )
     ));
   }
 );
 
 // src/components/promotions/display-conditions-control.tsx
-var ARIA_LABEL = __57("Display Conditions", "elementor");
+var ARIA_LABEL = __58("Display Conditions", "elementor");
 var TRACKING_DATA = { target_name: "display_conditions", location_l2: "general" };
 var DisplayConditionsControl = createControl(() => {
   const triggerRef = useRef28(null);
-  return /* @__PURE__ */ React116.createElement(
+  return /* @__PURE__ */ React118.createElement(
     Stack20,
     {
       direction: "row",
@@ -8080,8 +8198,8 @@ var DisplayConditionsControl = createControl(() => {
         alignItems: "center"
       }
     },
-    /* @__PURE__ */ React116.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "displayConditions", trackingData: TRACKING_DATA }),
-    /* @__PURE__ */ React116.createElement(Tooltip9, { title: ARIA_LABEL, placement: "top" }, /* @__PURE__ */ React116.createElement(
+    /* @__PURE__ */ React118.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "displayConditions", trackingData: TRACKING_DATA }),
+    /* @__PURE__ */ React118.createElement(Tooltip9, { title: ARIA_LABEL, placement: "top" }, /* @__PURE__ */ React118.createElement(
       IconButton8,
       {
         size: "tiny",
@@ -8094,22 +8212,22 @@ var DisplayConditionsControl = createControl(() => {
           borderRadius: 1
         }
       },
-      /* @__PURE__ */ React116.createElement(SitemapIcon, { fontSize: "tiny", color: "disabled" })
+      /* @__PURE__ */ React118.createElement(SitemapIcon, { fontSize: "tiny", color: "disabled" })
     ))
   );
 });
 
 // src/components/promotions/attributes-control.tsx
-import * as React117 from "react";
+import * as React119 from "react";
 import { useRef as useRef29 } from "react";
 import { PlusIcon as PlusIcon3 } from "@elementor/icons";
 import { Stack as Stack21, Tooltip as Tooltip10 } from "@elementor/ui";
-import { __ as __58 } from "@wordpress/i18n";
-var ARIA_LABEL2 = __58("Attributes", "elementor");
+import { __ as __59 } from "@wordpress/i18n";
+var ARIA_LABEL2 = __59("Attributes", "elementor");
 var TRACKING_DATA2 = { target_name: "attributes", location_l2: "general" };
 var AttributesControl = createControl(() => {
   const triggerRef = useRef29(null);
-  return /* @__PURE__ */ React117.createElement(
+  return /* @__PURE__ */ React119.createElement(
     Stack21,
     {
       direction: "row",
@@ -8119,8 +8237,8 @@ var AttributesControl = createControl(() => {
         alignItems: "center"
       }
     },
-    /* @__PURE__ */ React117.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "attributes", trackingData: TRACKING_DATA2 }),
-    /* @__PURE__ */ React117.createElement(Tooltip10, { title: ARIA_LABEL2, placement: "top" }, /* @__PURE__ */ React117.createElement(
+    /* @__PURE__ */ React119.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "attributes", trackingData: TRACKING_DATA2 }),
+    /* @__PURE__ */ React119.createElement(Tooltip10, { title: ARIA_LABEL2, placement: "top" }, /* @__PURE__ */ React119.createElement(
       PlusIcon3,
       {
         "aria-label": ARIA_LABEL2,
@@ -8134,17 +8252,17 @@ var AttributesControl = createControl(() => {
 });
 
 // src/components/icon-buttons/clear-icon-button.tsx
-import * as React118 from "react";
+import * as React120 from "react";
 import { BrushBigIcon } from "@elementor/icons";
 import { IconButton as IconButton9, styled as styled11, Tooltip as Tooltip11 } from "@elementor/ui";
 var CustomIconButton = styled11(IconButton9)(({ theme }) => ({
   width: theme.spacing(2.5),
   height: theme.spacing(2.5)
 }));
-var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React118.createElement(Tooltip11, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React118.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React118.createElement(BrushBigIcon, { fontSize: size })));
+var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React120.createElement(Tooltip11, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React120.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React120.createElement(BrushBigIcon, { fontSize: size })));
 
 // src/components/repeater/repeater.tsx
-import * as React119 from "react";
+import * as React121 from "react";
 import { useEffect as useEffect18, useState as useState20 } from "react";
 import { CopyIcon as CopyIcon2, EyeIcon as EyeIcon2, EyeOffIcon as EyeOffIcon2, PlusIcon as PlusIcon4, XIcon as XIcon4 } from "@elementor/icons";
 import {
@@ -8156,8 +8274,8 @@ import {
   Tooltip as Tooltip12,
   usePopupState as usePopupState10
 } from "@elementor/ui";
-import { __ as __59 } from "@wordpress/i18n";
-var SIZE11 = "tiny";
+import { __ as __60 } from "@wordpress/i18n";
+var SIZE12 = "tiny";
 var EMPTY_OPEN_ITEM2 = -1;
 var Repeater3 = ({
   label,
@@ -8237,20 +8355,20 @@ var Repeater3 = ({
   };
   const isButtonDisabled = disabled || disableAddItemButton;
   const shouldShowInfotip = isButtonDisabled && addButtonInfotipContent;
-  const addButton = /* @__PURE__ */ React119.createElement(
+  const addButton = /* @__PURE__ */ React121.createElement(
     IconButton10,
     {
-      size: SIZE11,
+      size: SIZE12,
       sx: {
         ml: "auto"
       },
       disabled: isButtonDisabled,
       onClick: addRepeaterItem,
-      "aria-label": __59("Add item", "elementor")
+      "aria-label": __60("Add item", "elementor")
     },
-    /* @__PURE__ */ React119.createElement(PlusIcon4, { fontSize: SIZE11 })
+    /* @__PURE__ */ React121.createElement(PlusIcon4, { fontSize: SIZE12 })
   );
-  return /* @__PURE__ */ React119.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React119.createElement(RepeaterHeader, { label, adornment: ControlAdornments }, shouldShowInfotip ? /* @__PURE__ */ React119.createElement(
+  return /* @__PURE__ */ React121.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React121.createElement(RepeaterHeader, { label, adornment: ControlAdornments }, shouldShowInfotip ? /* @__PURE__ */ React121.createElement(
     Infotip4,
     {
       placement: "right",
@@ -8258,20 +8376,20 @@ var Repeater3 = ({
       color: "secondary",
       slotProps: { popper: { sx: { width: 300 } } }
     },
-    /* @__PURE__ */ React119.createElement(Box27, { sx: { ...isButtonDisabled ? { cursor: "not-allowed" } : {} } }, addButton)
-  ) : addButton), 0 < uniqueKeys.length && /* @__PURE__ */ React119.createElement(SortableProvider, { value: uniqueKeys, onChange: onChangeOrder }, uniqueKeys.map((key) => {
+    /* @__PURE__ */ React121.createElement(Box27, { sx: { ...isButtonDisabled ? { cursor: "not-allowed" } : {} } }, addButton)
+  ) : addButton), 0 < uniqueKeys.length && /* @__PURE__ */ React121.createElement(SortableProvider, { value: uniqueKeys, onChange: onChangeOrder }, uniqueKeys.map((key) => {
     const index = uniqueKeys.indexOf(key);
     const value = items2[index];
     if (!value) {
       return null;
     }
-    return /* @__PURE__ */ React119.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React119.createElement(
+    return /* @__PURE__ */ React121.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React121.createElement(
       RepeaterItem,
       {
         disabled,
         propDisabled: value?.disabled,
-        label: /* @__PURE__ */ React119.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React119.createElement(itemSettings.Label, { value, index })),
-        startIcon: /* @__PURE__ */ React119.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React119.createElement(itemSettings.Icon, { value })),
+        label: /* @__PURE__ */ React121.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React121.createElement(itemSettings.Label, { value, index })),
+        startIcon: /* @__PURE__ */ React121.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React121.createElement(itemSettings.Icon, { value })),
         removeItem: () => removeRepeaterItem(index),
         duplicateItem: () => duplicateRepeaterItem(index),
         toggleDisableItem: () => toggleDisableRepeaterItem(index),
@@ -8285,7 +8403,7 @@ var Repeater3 = ({
         actions: itemSettings.actions,
         value
       },
-      (props) => /* @__PURE__ */ React119.createElement(
+      (props) => /* @__PURE__ */ React121.createElement(
         itemSettings.Content,
         {
           ...props,
@@ -8327,16 +8445,16 @@ var RepeaterItem = ({
   );
   const triggerProps = bindTrigger7(popoverState);
   usePopoverDismiss({ isOpen: popoverState.isOpen, onClose: popoverProps.onClose });
-  const duplicateLabel = __59("Duplicate", "elementor");
-  const toggleLabel = propDisabled ? __59("Show", "elementor") : __59("Hide", "elementor");
-  const removeLabel = __59("Remove", "elementor");
-  return /* @__PURE__ */ React119.createElement(Box27, { sx: { display: "contents" } }, /* @__PURE__ */ React119.createElement(
+  const duplicateLabel = __60("Duplicate", "elementor");
+  const toggleLabel = propDisabled ? __60("Show", "elementor") : __60("Hide", "elementor");
+  const removeLabel = __60("Remove", "elementor");
+  return /* @__PURE__ */ React121.createElement(Box27, { sx: { display: "contents" } }, /* @__PURE__ */ React121.createElement(
     RepeaterTag,
     {
       disabled,
       label,
       ref: setRef,
-      "aria-label": __59("Open item", "elementor"),
+      "aria-label": __60("Open item", "elementor"),
       ...triggerProps,
       onClick: (e) => {
         triggerProps.onClick(e);
@@ -8345,9 +8463,9 @@ var RepeaterItem = ({
         }
       },
       startIcon,
-      actions: /* @__PURE__ */ React119.createElement(React119.Fragment, null, showDuplicate && /* @__PURE__ */ React119.createElement(Tooltip12, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React119.createElement(IconButton10, { size: SIZE11, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React119.createElement(CopyIcon2, { fontSize: SIZE11 }))), showToggle && /* @__PURE__ */ React119.createElement(Tooltip12, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React119.createElement(IconButton10, { size: SIZE11, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React119.createElement(EyeOffIcon2, { fontSize: SIZE11 }) : /* @__PURE__ */ React119.createElement(EyeIcon2, { fontSize: SIZE11 }))), actions?.(value), showRemove && /* @__PURE__ */ React119.createElement(Tooltip12, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React119.createElement(IconButton10, { size: SIZE11, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React119.createElement(XIcon4, { fontSize: SIZE11 }))))
+      actions: /* @__PURE__ */ React121.createElement(React121.Fragment, null, showDuplicate && /* @__PURE__ */ React121.createElement(Tooltip12, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React121.createElement(IconButton10, { size: SIZE12, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React121.createElement(CopyIcon2, { fontSize: SIZE12 }))), showToggle && /* @__PURE__ */ React121.createElement(Tooltip12, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React121.createElement(IconButton10, { size: SIZE12, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React121.createElement(EyeOffIcon2, { fontSize: SIZE12 }) : /* @__PURE__ */ React121.createElement(EyeIcon2, { fontSize: SIZE12 }))), actions?.(value), showRemove && /* @__PURE__ */ React121.createElement(Tooltip12, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React121.createElement(IconButton10, { size: SIZE12, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React121.createElement(XIcon4, { fontSize: SIZE12 }))))
     }
-  ), /* @__PURE__ */ React119.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React119.createElement(Box27, null, children({ anchorEl: ref }))));
+  ), /* @__PURE__ */ React121.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React121.createElement(Box27, null, children({ anchorEl: ref }))));
 };
 var usePopover = (openOnMount, onOpen, onPopoverClose) => {
   const [ref, setRef] = useState20(null);
@@ -8372,8 +8490,8 @@ var usePopover = (openOnMount, onOpen, onPopoverClose) => {
 };
 
 // src/components/inline-editor-toolbar.tsx
-import * as React121 from "react";
-import { useEffect as useEffect20, useMemo as useMemo17, useRef as useRef31, useState as useState21 } from "react";
+import * as React123 from "react";
+import { useEffect as useEffect20, useMemo as useMemo18, useRef as useRef31, useState as useState21 } from "react";
 import { getContainer as getContainer2, getElementSetting } from "@elementor/editor-elements";
 import {
   BoldIcon,
@@ -8395,14 +8513,14 @@ import {
   usePopupState as usePopupState11
 } from "@elementor/ui";
 import { useEditorState } from "@tiptap/react";
-import { __ as __61 } from "@wordpress/i18n";
+import { __ as __62 } from "@wordpress/i18n";
 
 // src/components/url-popover.tsx
-import * as React120 from "react";
+import * as React122 from "react";
 import { useEffect as useEffect19, useRef as useRef30 } from "react";
 import { ExternalLinkIcon } from "@elementor/icons";
-import { bindPopover as bindPopover9, Popover as Popover8, Stack as Stack22, TextField as TextField10, ToggleButton as ToggleButton2, Tooltip as Tooltip13 } from "@elementor/ui";
-import { __ as __60 } from "@wordpress/i18n";
+import { bindPopover as bindPopover9, Popover as Popover8, Stack as Stack22, TextField as TextField11, ToggleButton as ToggleButton2, Tooltip as Tooltip13 } from "@elementor/ui";
+import { __ as __61 } from "@wordpress/i18n";
 var UrlPopover = ({
   popupState,
   restoreValue,
@@ -8422,7 +8540,7 @@ var UrlPopover = ({
     restoreValue();
     popupState.close();
   };
-  return /* @__PURE__ */ React120.createElement(
+  return /* @__PURE__ */ React122.createElement(
     Popover8,
     {
       slotProps: {
@@ -8433,30 +8551,30 @@ var UrlPopover = ({
       transformOrigin: { vertical: "top", horizontal: "left" },
       onClose: handleClose
     },
-    /* @__PURE__ */ React120.createElement(Stack22, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React120.createElement(
-      TextField10,
+    /* @__PURE__ */ React122.createElement(Stack22, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React122.createElement(
+      TextField11,
       {
         value,
         onChange,
         size: "tiny",
         fullWidth: true,
-        placeholder: __60("Type a URL", "elementor"),
+        placeholder: __61("Type a URL", "elementor"),
         inputProps: { ref: inputRef },
         color: "secondary",
         InputProps: { sx: { borderRadius: "8px" } },
         onKeyUp: (event) => event.key === "Enter" && handleClose()
       }
-    ), /* @__PURE__ */ React120.createElement(Tooltip13, { title: __60("Open in a new tab", "elementor") }, /* @__PURE__ */ React120.createElement(
+    ), /* @__PURE__ */ React122.createElement(Tooltip13, { title: __61("Open in a new tab", "elementor") }, /* @__PURE__ */ React122.createElement(
       ToggleButton2,
       {
         size: "tiny",
         value: "newTab",
         selected: openInNewTab,
         onClick: onToggleNewTab,
-        "aria-label": __60("Open in a new tab", "elementor"),
+        "aria-label": __61("Open in a new tab", "elementor"),
         sx: { borderRadius: "8px" }
       },
-      /* @__PURE__ */ React120.createElement(ExternalLinkIcon, { fontSize: "tiny" })
+      /* @__PURE__ */ React122.createElement(ExternalLinkIcon, { fontSize: "tiny" })
     )))
   );
 };
@@ -8472,7 +8590,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
     editor,
     selector: (ctx) => possibleFormats.filter((format) => ctx.editor.isActive(format))
   });
-  const formatButtonsList = useMemo17(() => {
+  const formatButtonsList = useMemo18(() => {
     const buttons = Object.values(formatButtons);
     if (isElementClickable) {
       return buttons.filter((button) => button.action !== "link");
@@ -8512,7 +8630,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
   useEffect20(() => {
     editor?.commands?.focus();
   }, [editor]);
-  return /* @__PURE__ */ React121.createElement(
+  return /* @__PURE__ */ React123.createElement(
     Box28,
     {
       ref: toolbarRef,
@@ -8529,8 +8647,8 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
         ...sx
       }
     },
-    /* @__PURE__ */ React121.createElement(Tooltip14, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React121.createElement(IconButton11, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
-    /* @__PURE__ */ React121.createElement(
+    /* @__PURE__ */ React123.createElement(Tooltip14, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React123.createElement(IconButton11, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
+    /* @__PURE__ */ React123.createElement(
       ToggleButtonGroup2,
       {
         value: editorState,
@@ -8552,7 +8670,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
           }
         }
       },
-      formatButtonsList.map((button) => /* @__PURE__ */ React121.createElement(Tooltip14, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React121.createElement(
+      formatButtonsList.map((button) => /* @__PURE__ */ React123.createElement(Tooltip14, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React123.createElement(
         ToggleButton3,
         {
           value: button.action,
@@ -8570,7 +8688,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
         button.icon
       )))
     ),
-    /* @__PURE__ */ React121.createElement(
+    /* @__PURE__ */ React123.createElement(
       UrlPopover,
       {
         popupState: linkPopupState,
@@ -8593,64 +8711,64 @@ var checkIfElementIsClickable = (elementId) => {
 };
 var toolbarButtons = {
   clear: {
-    label: __61("Clear", "elementor"),
-    icon: /* @__PURE__ */ React121.createElement(MinusIcon2, { fontSize: "tiny" }),
+    label: __62("Clear", "elementor"),
+    icon: /* @__PURE__ */ React123.createElement(MinusIcon2, { fontSize: "tiny" }),
     action: "clear",
     method: (editor) => {
       editor.chain().focus().clearNodes().unsetAllMarks().run();
     }
   },
   bold: {
-    label: __61("Bold", "elementor"),
-    icon: /* @__PURE__ */ React121.createElement(BoldIcon, { fontSize: "tiny" }),
+    label: __62("Bold", "elementor"),
+    icon: /* @__PURE__ */ React123.createElement(BoldIcon, { fontSize: "tiny" }),
     action: "bold",
     method: (editor) => {
       editor.chain().focus().toggleBold().run();
     }
   },
   italic: {
-    label: __61("Italic", "elementor"),
-    icon: /* @__PURE__ */ React121.createElement(ItalicIcon, { fontSize: "tiny" }),
+    label: __62("Italic", "elementor"),
+    icon: /* @__PURE__ */ React123.createElement(ItalicIcon, { fontSize: "tiny" }),
     action: "italic",
     method: (editor) => {
       editor.chain().focus().toggleItalic().run();
     }
   },
   underline: {
-    label: __61("Underline", "elementor"),
-    icon: /* @__PURE__ */ React121.createElement(UnderlineIcon, { fontSize: "tiny" }),
+    label: __62("Underline", "elementor"),
+    icon: /* @__PURE__ */ React123.createElement(UnderlineIcon, { fontSize: "tiny" }),
     action: "underline",
     method: (editor) => {
       editor.chain().focus().toggleUnderline().run();
     }
   },
   strike: {
-    label: __61("Strikethrough", "elementor"),
-    icon: /* @__PURE__ */ React121.createElement(StrikethroughIcon, { fontSize: "tiny" }),
+    label: __62("Strikethrough", "elementor"),
+    icon: /* @__PURE__ */ React123.createElement(StrikethroughIcon, { fontSize: "tiny" }),
     action: "strike",
     method: (editor) => {
       editor.chain().focus().toggleStrike().run();
     }
   },
   superscript: {
-    label: __61("Superscript", "elementor"),
-    icon: /* @__PURE__ */ React121.createElement(SuperscriptIcon, { fontSize: "tiny" }),
+    label: __62("Superscript", "elementor"),
+    icon: /* @__PURE__ */ React123.createElement(SuperscriptIcon, { fontSize: "tiny" }),
     action: "superscript",
     method: (editor) => {
       editor.chain().focus().toggleSuperscript().run();
     }
   },
   subscript: {
-    label: __61("Subscript", "elementor"),
-    icon: /* @__PURE__ */ React121.createElement(SubscriptIcon, { fontSize: "tiny" }),
+    label: __62("Subscript", "elementor"),
+    icon: /* @__PURE__ */ React123.createElement(SubscriptIcon, { fontSize: "tiny" }),
     action: "subscript",
     method: (editor) => {
       editor.chain().focus().toggleSubscript().run();
     }
   },
   link: {
-    label: __61("Link", "elementor"),
-    icon: /* @__PURE__ */ React121.createElement(LinkIcon3, { fontSize: "tiny" }),
+    label: __62("Link", "elementor"),
+    icon: /* @__PURE__ */ React123.createElement(LinkIcon3, { fontSize: "tiny" }),
     action: "link",
     method: null
   }
@@ -8659,7 +8777,7 @@ var { clear: clearButton, ...formatButtons } = toolbarButtons;
 var possibleFormats = Object.keys(formatButtons);
 
 // src/components/size/unstable-size-field.tsx
-import * as React124 from "react";
+import * as React126 from "react";
 import { InputAdornment as InputAdornment6 } from "@elementor/ui";
 
 // src/hooks/use-size-value.ts
@@ -8702,7 +8820,7 @@ var differsFromExternal = (newState, externalState) => {
 };
 
 // src/components/size/unit-select.tsx
-import * as React122 from "react";
+import * as React124 from "react";
 import { useId as useId4 } from "react";
 import { MenuListItem as MenuListItem8 } from "@elementor/editor-ui";
 import { bindMenu as bindMenu3, bindTrigger as bindTrigger8, Button as Button7, Menu as Menu4, styled as styled12, usePopupState as usePopupState12 } from "@elementor/ui";
@@ -8720,7 +8838,7 @@ var UnitSelect = ({ value, showPrimaryColor, onClick, options }) => {
     onClick(options[index]);
     popupState.close();
   };
-  return /* @__PURE__ */ React122.createElement(React122.Fragment, null, /* @__PURE__ */ React122.createElement(StyledButton3, { isPrimaryColor: showPrimaryColor, size: "small", ...bindTrigger8(popupState) }, value), /* @__PURE__ */ React122.createElement(Menu4, { MenuListProps: { dense: true }, ...bindMenu3(popupState) }, options.map((option, index) => /* @__PURE__ */ React122.createElement(
+  return /* @__PURE__ */ React124.createElement(React124.Fragment, null, /* @__PURE__ */ React124.createElement(StyledButton3, { isPrimaryColor: showPrimaryColor, size: "small", ...bindTrigger8(popupState) }, value), /* @__PURE__ */ React124.createElement(Menu4, { MenuListProps: { dense: true }, ...bindMenu3(popupState) }, options.map((option, index) => /* @__PURE__ */ React124.createElement(
     MenuListItem8,
     {
       key: option,
@@ -8749,11 +8867,11 @@ var StyledButton3 = styled12(Button7, {
 }));
 
 // src/components/size/unstable-size-input.tsx
-import * as React123 from "react";
+import * as React125 from "react";
 import { forwardRef as forwardRef13 } from "react";
 var UnstableSizeInput = forwardRef13(
   ({ type, value, onChange, onKeyDown, onKeyUp, InputProps, onBlur, focused, disabled }, ref) => {
-    return /* @__PURE__ */ React123.createElement(
+    return /* @__PURE__ */ React125.createElement(
       NumberInput,
       {
         ref,
@@ -8791,7 +8909,7 @@ var UnstableSizeField = ({
   const shouldHighlightUnit2 = () => {
     return hasValue(size);
   };
-  return /* @__PURE__ */ React124.createElement(
+  return /* @__PURE__ */ React126.createElement(
     UnstableSizeInput,
     {
       type: "number",
@@ -8800,8 +8918,8 @@ var UnstableSizeField = ({
       onChange: (event) => setSize(event.target.value),
       InputProps: {
         ...InputProps,
-        startAdornment: startIcon && /* @__PURE__ */ React124.createElement(InputAdornment6, { position: "start" }, startIcon),
-        endAdornment: /* @__PURE__ */ React124.createElement(InputAdornment6, { position: "end" }, /* @__PURE__ */ React124.createElement(
+        startAdornment: startIcon && /* @__PURE__ */ React126.createElement(InputAdornment6, { position: "start" }, startIcon),
+        endAdornment: /* @__PURE__ */ React126.createElement(InputAdornment6, { position: "end" }, /* @__PURE__ */ React126.createElement(
           UnitSelect,
           {
             options: units2,
@@ -8819,7 +8937,7 @@ var hasValue = (value) => {
 };
 
 // src/hooks/use-font-families.ts
-import { useMemo as useMemo18 } from "react";
+import { useMemo as useMemo19 } from "react";
 import { getElementorConfig } from "@elementor/editor-v1-adapters";
 var getFontControlConfig = () => {
   const { controls } = getElementorConfig();
@@ -8827,7 +8945,7 @@ var getFontControlConfig = () => {
 };
 var useFontFamilies = () => {
   const { groups, options } = getFontControlConfig();
-  return useMemo18(() => {
+  return useMemo19(() => {
     if (!groups || !options) {
       return [];
     }
@@ -8890,6 +9008,7 @@ export {
   PromotionTrigger,
   PropKeyProvider,
   PropProvider,
+  QueryChipsControl,
   QueryControl,
   RepeatableControl,
   Repeater3 as Repeater,