@elementor/editor-controls 4.2.0-854 → 4.2.0-855

package/dist/index.mjs

@@ -8126,15 +8126,52 @@ var AttachmentTypeControl = createControl(({ label, options }) => {
   ))));
 });
 
+// src/controls/grid-span-control.tsx
+import * as React117 from "react";
+import { spanPropTypeUtil } from "@elementor/editor-props";
+import { TextField as TextField11 } from "@elementor/ui";
+var GridSpanControl = createControl(
+  ({
+    placeholder: propPlaceholder,
+    error,
+    inputValue,
+    inputDisabled,
+    helperText,
+    sx,
+    ariaLabel
+  }) => {
+    const { value, setValue, disabled, placeholder: boundPlaceholder } = useBoundProp(spanPropTypeUtil);
+    const handleChange = (event) => setValue(event.target.value);
+    const placeholder = propPlaceholder ?? boundPlaceholder ?? void 0;
+    return /* @__PURE__ */ React117.createElement(ControlActions, null, /* @__PURE__ */ React117.createElement(
+      TextField11,
+      {
+        size: "tiny",
+        fullWidth: true,
+        disabled: inputDisabled ?? disabled,
+        value: inputValue ?? value ?? "",
+        onChange: handleChange,
+        placeholder,
+        error,
+        helperText,
+        sx,
+        inputProps: {
+          ...ariaLabel ? { "aria-label": ariaLabel } : {}
+        }
+      }
+    ));
+  }
+);
+
 // src/components/promotions/display-conditions-control.tsx
-import * as React118 from "react";
+import * as React119 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 __58 } from "@wordpress/i18n";
 
 // src/components/promotions/promotion-trigger.tsx
-import * as React117 from "react";
+import * as React118 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";
@@ -8154,7 +8191,7 @@ var PromotionTrigger = forwardRef12(
       });
     }, [trackingData]);
     useImperativeHandle(ref, () => ({ toggle }), [toggle]);
-    return /* @__PURE__ */ React117.createElement(React117.Fragment, null, promotion && /* @__PURE__ */ React117.createElement(
+    return /* @__PURE__ */ React118.createElement(React118.Fragment, null, promotion && /* @__PURE__ */ React118.createElement(
       PromotionInfotip,
       {
         title: promotion.title,
@@ -8168,7 +8205,7 @@ var PromotionTrigger = forwardRef12(
         },
         onCtaClick: () => trackUpgradePromotionClick(trackingData)
       },
-      /* @__PURE__ */ React117.createElement(
+      /* @__PURE__ */ React118.createElement(
         Box26,
         {
           onClick: (e) => {
@@ -8177,7 +8214,7 @@ var PromotionTrigger = forwardRef12(
           },
           sx: { cursor: "pointer", display: "inline-flex" }
         },
-        children ?? /* @__PURE__ */ React117.createElement(PromotionChip2, null)
+        children ?? /* @__PURE__ */ React118.createElement(PromotionChip2, null)
       )
     ));
   }
@@ -8188,7 +8225,7 @@ 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__ */ React118.createElement(
+  return /* @__PURE__ */ React119.createElement(
     Stack20,
     {
       direction: "row",
@@ -8198,8 +8235,8 @@ var DisplayConditionsControl = createControl(() => {
         alignItems: "center"
       }
     },
-    /* @__PURE__ */ React118.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "displayConditions", trackingData: TRACKING_DATA }),
-    /* @__PURE__ */ React118.createElement(Tooltip9, { title: ARIA_LABEL, placement: "top" }, /* @__PURE__ */ React118.createElement(
+    /* @__PURE__ */ React119.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "displayConditions", trackingData: TRACKING_DATA }),
+    /* @__PURE__ */ React119.createElement(Tooltip9, { title: ARIA_LABEL, placement: "top" }, /* @__PURE__ */ React119.createElement(
       IconButton8,
       {
         size: "tiny",
@@ -8212,13 +8249,13 @@ var DisplayConditionsControl = createControl(() => {
           borderRadius: 1
         }
       },
-      /* @__PURE__ */ React118.createElement(SitemapIcon, { fontSize: "tiny", color: "disabled" })
+      /* @__PURE__ */ React119.createElement(SitemapIcon, { fontSize: "tiny", color: "disabled" })
     ))
   );
 });
 
 // src/components/promotions/attributes-control.tsx
-import * as React119 from "react";
+import * as React120 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";
@@ -8227,7 +8264,7 @@ var ARIA_LABEL2 = __59("Attributes", "elementor");
 var TRACKING_DATA2 = { target_name: "attributes", location_l2: "general" };
 var AttributesControl = createControl(() => {
   const triggerRef = useRef29(null);
-  return /* @__PURE__ */ React119.createElement(
+  return /* @__PURE__ */ React120.createElement(
     Stack21,
     {
       direction: "row",
@@ -8237,8 +8274,8 @@ var AttributesControl = createControl(() => {
         alignItems: "center"
       }
     },
-    /* @__PURE__ */ React119.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "attributes", trackingData: TRACKING_DATA2 }),
-    /* @__PURE__ */ React119.createElement(Tooltip10, { title: ARIA_LABEL2, placement: "top" }, /* @__PURE__ */ React119.createElement(
+    /* @__PURE__ */ React120.createElement(PromotionTrigger, { ref: triggerRef, promotionKey: "attributes", trackingData: TRACKING_DATA2 }),
+    /* @__PURE__ */ React120.createElement(Tooltip10, { title: ARIA_LABEL2, placement: "top" }, /* @__PURE__ */ React120.createElement(
       PlusIcon3,
       {
         "aria-label": ARIA_LABEL2,
@@ -8252,17 +8289,17 @@ var AttributesControl = createControl(() => {
 });
 
 // src/components/icon-buttons/clear-icon-button.tsx
-import * as React120 from "react";
+import * as React121 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__ */ 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 })));
+var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React121.createElement(Tooltip11, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React121.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React121.createElement(BrushBigIcon, { fontSize: size })));
 
 // src/components/repeater/repeater.tsx
-import * as React121 from "react";
+import * as React122 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 {
@@ -8355,7 +8392,7 @@ var Repeater3 = ({
   };
   const isButtonDisabled = disabled || disableAddItemButton;
   const shouldShowInfotip = isButtonDisabled && addButtonInfotipContent;
-  const addButton = /* @__PURE__ */ React121.createElement(
+  const addButton = /* @__PURE__ */ React122.createElement(
     IconButton10,
     {
       size: SIZE12,
@@ -8366,9 +8403,9 @@ var Repeater3 = ({
       onClick: addRepeaterItem,
       "aria-label": __60("Add item", "elementor")
     },
-    /* @__PURE__ */ React121.createElement(PlusIcon4, { fontSize: SIZE12 })
+    /* @__PURE__ */ React122.createElement(PlusIcon4, { fontSize: SIZE12 })
   );
-  return /* @__PURE__ */ React121.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React121.createElement(RepeaterHeader, { label, adornment: ControlAdornments }, shouldShowInfotip ? /* @__PURE__ */ React121.createElement(
+  return /* @__PURE__ */ React122.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React122.createElement(RepeaterHeader, { label, adornment: ControlAdornments }, shouldShowInfotip ? /* @__PURE__ */ React122.createElement(
     Infotip4,
     {
       placement: "right",
@@ -8376,20 +8413,20 @@ var Repeater3 = ({
       color: "secondary",
       slotProps: { popper: { sx: { width: 300 } } }
     },
-    /* @__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) => {
+    /* @__PURE__ */ React122.createElement(Box27, { sx: { ...isButtonDisabled ? { cursor: "not-allowed" } : {} } }, addButton)
+  ) : addButton), 0 < uniqueKeys.length && /* @__PURE__ */ React122.createElement(SortableProvider, { value: uniqueKeys, onChange: onChangeOrder }, uniqueKeys.map((key) => {
     const index = uniqueKeys.indexOf(key);
     const value = items2[index];
     if (!value) {
       return null;
     }
-    return /* @__PURE__ */ React121.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React121.createElement(
+    return /* @__PURE__ */ React122.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React122.createElement(
       RepeaterItem,
       {
         disabled,
         propDisabled: value?.disabled,
-        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 })),
+        label: /* @__PURE__ */ React122.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React122.createElement(itemSettings.Label, { value, index })),
+        startIcon: /* @__PURE__ */ React122.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React122.createElement(itemSettings.Icon, { value })),
         removeItem: () => removeRepeaterItem(index),
         duplicateItem: () => duplicateRepeaterItem(index),
         toggleDisableItem: () => toggleDisableRepeaterItem(index),
@@ -8403,7 +8440,7 @@ var Repeater3 = ({
         actions: itemSettings.actions,
         value
       },
-      (props) => /* @__PURE__ */ React121.createElement(
+      (props) => /* @__PURE__ */ React122.createElement(
         itemSettings.Content,
         {
           ...props,
@@ -8448,7 +8485,7 @@ var RepeaterItem = ({
   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(
+  return /* @__PURE__ */ React122.createElement(Box27, { sx: { display: "contents" } }, /* @__PURE__ */ React122.createElement(
     RepeaterTag,
     {
       disabled,
@@ -8463,9 +8500,9 @@ var RepeaterItem = ({
         }
       },
       startIcon,
-      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 }))))
+      actions: /* @__PURE__ */ React122.createElement(React122.Fragment, null, showDuplicate && /* @__PURE__ */ React122.createElement(Tooltip12, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React122.createElement(IconButton10, { size: SIZE12, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React122.createElement(CopyIcon2, { fontSize: SIZE12 }))), showToggle && /* @__PURE__ */ React122.createElement(Tooltip12, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React122.createElement(IconButton10, { size: SIZE12, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React122.createElement(EyeOffIcon2, { fontSize: SIZE12 }) : /* @__PURE__ */ React122.createElement(EyeIcon2, { fontSize: SIZE12 }))), actions?.(value), showRemove && /* @__PURE__ */ React122.createElement(Tooltip12, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React122.createElement(IconButton10, { size: SIZE12, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React122.createElement(XIcon4, { fontSize: SIZE12 }))))
     }
-  ), /* @__PURE__ */ React121.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React121.createElement(Box27, null, children({ anchorEl: ref }))));
+  ), /* @__PURE__ */ React122.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React122.createElement(Box27, null, children({ anchorEl: ref }))));
 };
 var usePopover = (openOnMount, onOpen, onPopoverClose) => {
   const [ref, setRef] = useState20(null);
@@ -8490,7 +8527,7 @@ var usePopover = (openOnMount, onOpen, onPopoverClose) => {
 };
 
 // src/components/inline-editor-toolbar.tsx
-import * as React123 from "react";
+import * as React124 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 {
@@ -8516,10 +8553,10 @@ import { useEditorState } from "@tiptap/react";
 import { __ as __62 } from "@wordpress/i18n";
 
 // src/components/url-popover.tsx
-import * as React122 from "react";
+import * as React123 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 TextField11, ToggleButton as ToggleButton2, Tooltip as Tooltip13 } from "@elementor/ui";
+import { bindPopover as bindPopover9, Popover as Popover8, Stack as Stack22, TextField as TextField12, ToggleButton as ToggleButton2, Tooltip as Tooltip13 } from "@elementor/ui";
 import { __ as __61 } from "@wordpress/i18n";
 var UrlPopover = ({
   popupState,
@@ -8540,7 +8577,7 @@ var UrlPopover = ({
     restoreValue();
     popupState.close();
   };
-  return /* @__PURE__ */ React122.createElement(
+  return /* @__PURE__ */ React123.createElement(
     Popover8,
     {
       slotProps: {
@@ -8551,8 +8588,8 @@ var UrlPopover = ({
       transformOrigin: { vertical: "top", horizontal: "left" },
       onClose: handleClose
     },
-    /* @__PURE__ */ React122.createElement(Stack22, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React122.createElement(
-      TextField11,
+    /* @__PURE__ */ React123.createElement(Stack22, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React123.createElement(
+      TextField12,
       {
         value,
         onChange,
@@ -8564,7 +8601,7 @@ var UrlPopover = ({
         InputProps: { sx: { borderRadius: "8px" } },
         onKeyUp: (event) => event.key === "Enter" && handleClose()
       }
-    ), /* @__PURE__ */ React122.createElement(Tooltip13, { title: __61("Open in a new tab", "elementor") }, /* @__PURE__ */ React122.createElement(
+    ), /* @__PURE__ */ React123.createElement(Tooltip13, { title: __61("Open in a new tab", "elementor") }, /* @__PURE__ */ React123.createElement(
       ToggleButton2,
       {
         size: "tiny",
@@ -8574,7 +8611,7 @@ var UrlPopover = ({
         "aria-label": __61("Open in a new tab", "elementor"),
         sx: { borderRadius: "8px" }
       },
-      /* @__PURE__ */ React122.createElement(ExternalLinkIcon, { fontSize: "tiny" })
+      /* @__PURE__ */ React123.createElement(ExternalLinkIcon, { fontSize: "tiny" })
     )))
   );
 };
@@ -8630,7 +8667,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
   useEffect20(() => {
     editor?.commands?.focus();
   }, [editor]);
-  return /* @__PURE__ */ React123.createElement(
+  return /* @__PURE__ */ React124.createElement(
     Box28,
     {
       ref: toolbarRef,
@@ -8647,8 +8684,8 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
         ...sx
       }
     },
-    /* @__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(
+    /* @__PURE__ */ React124.createElement(Tooltip14, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React124.createElement(IconButton11, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
+    /* @__PURE__ */ React124.createElement(
       ToggleButtonGroup2,
       {
         value: editorState,
@@ -8670,7 +8707,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
           }
         }
       },
-      formatButtonsList.map((button) => /* @__PURE__ */ React123.createElement(Tooltip14, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React123.createElement(
+      formatButtonsList.map((button) => /* @__PURE__ */ React124.createElement(Tooltip14, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React124.createElement(
         ToggleButton3,
         {
           value: button.action,
@@ -8688,7 +8725,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
         button.icon
       )))
     ),
-    /* @__PURE__ */ React123.createElement(
+    /* @__PURE__ */ React124.createElement(
       UrlPopover,
       {
         popupState: linkPopupState,
@@ -8712,7 +8749,7 @@ var checkIfElementIsClickable = (elementId) => {
 var toolbarButtons = {
   clear: {
     label: __62("Clear", "elementor"),
-    icon: /* @__PURE__ */ React123.createElement(MinusIcon2, { fontSize: "tiny" }),
+    icon: /* @__PURE__ */ React124.createElement(MinusIcon2, { fontSize: "tiny" }),
     action: "clear",
     method: (editor) => {
       editor.chain().focus().clearNodes().unsetAllMarks().run();
@@ -8720,7 +8757,7 @@ var toolbarButtons = {
   },
   bold: {
     label: __62("Bold", "elementor"),
-    icon: /* @__PURE__ */ React123.createElement(BoldIcon, { fontSize: "tiny" }),
+    icon: /* @__PURE__ */ React124.createElement(BoldIcon, { fontSize: "tiny" }),
     action: "bold",
     method: (editor) => {
       editor.chain().focus().toggleBold().run();
@@ -8728,7 +8765,7 @@ var toolbarButtons = {
   },
   italic: {
     label: __62("Italic", "elementor"),
-    icon: /* @__PURE__ */ React123.createElement(ItalicIcon, { fontSize: "tiny" }),
+    icon: /* @__PURE__ */ React124.createElement(ItalicIcon, { fontSize: "tiny" }),
     action: "italic",
     method: (editor) => {
       editor.chain().focus().toggleItalic().run();
@@ -8736,7 +8773,7 @@ var toolbarButtons = {
   },
   underline: {
     label: __62("Underline", "elementor"),
-    icon: /* @__PURE__ */ React123.createElement(UnderlineIcon, { fontSize: "tiny" }),
+    icon: /* @__PURE__ */ React124.createElement(UnderlineIcon, { fontSize: "tiny" }),
     action: "underline",
     method: (editor) => {
       editor.chain().focus().toggleUnderline().run();
@@ -8744,7 +8781,7 @@ var toolbarButtons = {
   },
   strike: {
     label: __62("Strikethrough", "elementor"),
-    icon: /* @__PURE__ */ React123.createElement(StrikethroughIcon, { fontSize: "tiny" }),
+    icon: /* @__PURE__ */ React124.createElement(StrikethroughIcon, { fontSize: "tiny" }),
     action: "strike",
     method: (editor) => {
       editor.chain().focus().toggleStrike().run();
@@ -8752,7 +8789,7 @@ var toolbarButtons = {
   },
   superscript: {
     label: __62("Superscript", "elementor"),
-    icon: /* @__PURE__ */ React123.createElement(SuperscriptIcon, { fontSize: "tiny" }),
+    icon: /* @__PURE__ */ React124.createElement(SuperscriptIcon, { fontSize: "tiny" }),
     action: "superscript",
     method: (editor) => {
       editor.chain().focus().toggleSuperscript().run();
@@ -8760,7 +8797,7 @@ var toolbarButtons = {
   },
   subscript: {
     label: __62("Subscript", "elementor"),
-    icon: /* @__PURE__ */ React123.createElement(SubscriptIcon, { fontSize: "tiny" }),
+    icon: /* @__PURE__ */ React124.createElement(SubscriptIcon, { fontSize: "tiny" }),
     action: "subscript",
     method: (editor) => {
       editor.chain().focus().toggleSubscript().run();
@@ -8768,7 +8805,7 @@ var toolbarButtons = {
   },
   link: {
     label: __62("Link", "elementor"),
-    icon: /* @__PURE__ */ React123.createElement(LinkIcon3, { fontSize: "tiny" }),
+    icon: /* @__PURE__ */ React124.createElement(LinkIcon3, { fontSize: "tiny" }),
     action: "link",
     method: null
   }
@@ -8777,7 +8814,7 @@ var { clear: clearButton, ...formatButtons } = toolbarButtons;
 var possibleFormats = Object.keys(formatButtons);
 
 // src/components/size/unstable-size-field.tsx
-import * as React126 from "react";
+import * as React127 from "react";
 import { InputAdornment as InputAdornment6 } from "@elementor/ui";
 
 // src/hooks/use-size-value.ts
@@ -8820,7 +8857,7 @@ var differsFromExternal = (newState, externalState) => {
 };
 
 // src/components/size/unit-select.tsx
-import * as React124 from "react";
+import * as React125 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";
@@ -8838,7 +8875,7 @@ var UnitSelect = ({ value, showPrimaryColor, onClick, options }) => {
     onClick(options[index]);
     popupState.close();
   };
-  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(
+  return /* @__PURE__ */ React125.createElement(React125.Fragment, null, /* @__PURE__ */ React125.createElement(StyledButton3, { isPrimaryColor: showPrimaryColor, size: "small", ...bindTrigger8(popupState) }, value), /* @__PURE__ */ React125.createElement(Menu4, { MenuListProps: { dense: true }, ...bindMenu3(popupState) }, options.map((option, index) => /* @__PURE__ */ React125.createElement(
     MenuListItem8,
     {
       key: option,
@@ -8867,11 +8904,11 @@ var StyledButton3 = styled12(Button7, {
 }));
 
 // src/components/size/unstable-size-input.tsx
-import * as React125 from "react";
+import * as React126 from "react";
 import { forwardRef as forwardRef13 } from "react";
 var UnstableSizeInput = forwardRef13(
   ({ type, value, onChange, onKeyDown, onKeyUp, InputProps, onBlur, focused, disabled }, ref) => {
-    return /* @__PURE__ */ React125.createElement(
+    return /* @__PURE__ */ React126.createElement(
       NumberInput,
       {
         ref,
@@ -8909,7 +8946,7 @@ var UnstableSizeField = ({
   const shouldHighlightUnit2 = () => {
     return hasValue(size);
   };
-  return /* @__PURE__ */ React126.createElement(
+  return /* @__PURE__ */ React127.createElement(
     UnstableSizeInput,
     {
       type: "number",
@@ -8918,8 +8955,8 @@ var UnstableSizeField = ({
       onChange: (event) => setSize(event.target.value),
       InputProps: {
         ...InputProps,
-        startAdornment: startIcon && /* @__PURE__ */ React126.createElement(InputAdornment6, { position: "start" }, startIcon),
-        endAdornment: /* @__PURE__ */ React126.createElement(InputAdornment6, { position: "end" }, /* @__PURE__ */ React126.createElement(
+        startAdornment: startIcon && /* @__PURE__ */ React127.createElement(InputAdornment6, { position: "start" }, startIcon),
+        endAdornment: /* @__PURE__ */ React127.createElement(InputAdornment6, { position: "end" }, /* @__PURE__ */ React127.createElement(
           UnitSelect,
           {
             options: units2,
@@ -8990,6 +9027,7 @@ export {
   FilterRepeaterControl,
   FontFamilyControl,
   GapControl,
+  GridSpanControl,
   HtmlTagControl,
   ImageControl,
   InlineEditingControl,