@elementor/editor-controls 4.0.0-520 → 4.0.0-522

package/dist/index.mjs

@@ -6433,30 +6433,91 @@ var InlineEditingControl = createControl(
   }
 );
 
-// src/components/icon-buttons/clear-icon-button.tsx
+// src/components/promotions/display-conditions-control.tsx
 import * as React100 from "react";
+import { useState as useState17 } from "react";
+import { PromotionChip as PromotionChip2, PromotionInfotip } from "@elementor/editor-ui";
+import { SitemapIcon } from "@elementor/icons";
+import { Box as Box24, IconButton as IconButton8, Stack as Stack16, Tooltip as Tooltip9 } from "@elementor/ui";
+import { __ as __50 } from "@wordpress/i18n";
+var ARIA_LABEL = __50("Display Conditions", "elementor");
+function getDisplayConditionPromotion() {
+  return window.elementor?.config?.v4Promotions?.displayConditions;
+}
+var DisplayConditionsControl = createControl(() => {
+  const [isInfotipOpen, setIsInfotipOpen] = useState17(false);
+  const promotion = getDisplayConditionPromotion();
+  return /* @__PURE__ */ React100.createElement(
+    Stack16,
+    {
+      direction: "row",
+      spacing: 2,
+      sx: {
+        justifyContent: "flex-end",
+        alignItems: "center"
+      }
+    },
+    /* @__PURE__ */ React100.createElement(
+      PromotionInfotip,
+      {
+        title: promotion?.title ?? "",
+        content: promotion?.content ?? "",
+        assetUrl: promotion?.image ?? "",
+        ctaUrl: promotion?.ctaUrl ?? "",
+        open: isInfotipOpen,
+        onClose: () => setIsInfotipOpen(false)
+      },
+      /* @__PURE__ */ React100.createElement(
+        Box24,
+        {
+          onClick: () => setIsInfotipOpen((prev) => !prev),
+          sx: { cursor: "pointer", display: "inline-flex" }
+        },
+        /* @__PURE__ */ React100.createElement(PromotionChip2, null)
+      )
+    ),
+    /* @__PURE__ */ React100.createElement(Tooltip9, { title: ARIA_LABEL, placement: "top" }, /* @__PURE__ */ React100.createElement(
+      IconButton8,
+      {
+        size: "tiny",
+        "aria-label": ARIA_LABEL,
+        "data-behavior": "display-conditions",
+        onClick: () => setIsInfotipOpen((prev) => !prev),
+        sx: {
+          border: "1px solid",
+          borderColor: "divider",
+          borderRadius: 1
+        }
+      },
+      /* @__PURE__ */ React100.createElement(SitemapIcon, { fontSize: "tiny", color: "disabled" })
+    ))
+  );
+});
+
+// src/components/icon-buttons/clear-icon-button.tsx
+import * as React101 from "react";
 import { BrushBigIcon } from "@elementor/icons";
-import { IconButton as IconButton8, styled as styled9, Tooltip as Tooltip9 } from "@elementor/ui";
-var CustomIconButton = styled9(IconButton8)(({ theme }) => ({
+import { IconButton as IconButton9, styled as styled9, Tooltip as Tooltip10 } from "@elementor/ui";
+var CustomIconButton = styled9(IconButton9)(({ theme }) => ({
   width: theme.spacing(2.5),
   height: theme.spacing(2.5)
 }));
-var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React100.createElement(Tooltip9, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React100.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React100.createElement(BrushBigIcon, { fontSize: size })));
+var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React101.createElement(Tooltip10, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React101.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React101.createElement(BrushBigIcon, { fontSize: size })));
 
 // src/components/repeater/repeater.tsx
-import * as React101 from "react";
-import { useEffect as useEffect12, useState as useState17 } from "react";
+import * as React102 from "react";
+import { useEffect as useEffect12, useState as useState18 } from "react";
 import { CopyIcon as CopyIcon2, EyeIcon as EyeIcon2, EyeOffIcon as EyeOffIcon2, PlusIcon as PlusIcon3, XIcon as XIcon4 } from "@elementor/icons";
 import {
   bindPopover as bindPopover7,
   bindTrigger as bindTrigger6,
-  Box as Box24,
-  IconButton as IconButton9,
+  Box as Box25,
+  IconButton as IconButton10,
   Infotip as Infotip4,
-  Tooltip as Tooltip10,
+  Tooltip as Tooltip11,
   usePopupState as usePopupState8
 } from "@elementor/ui";
-import { __ as __50 } from "@wordpress/i18n";
+import { __ as __51 } from "@wordpress/i18n";
 var SIZE9 = "tiny";
 var EMPTY_OPEN_ITEM2 = -1;
 var Repeater3 = ({
@@ -6474,7 +6535,7 @@ var Repeater3 = ({
   openItem: initialOpenItem = EMPTY_OPEN_ITEM2,
   isSortable = true
 }) => {
-  const [openItem, setOpenItem] = useState17(initialOpenItem);
+  const [openItem, setOpenItem] = useState18(initialOpenItem);
   const uniqueKeys = items2.map(
     (item, index) => isSortable && "getId" in itemSettings ? itemSettings.getId({ item, index }) : String(index)
   );
@@ -6537,8 +6598,8 @@ var Repeater3 = ({
   };
   const isButtonDisabled = disabled || disableAddItemButton;
   const shouldShowInfotip = isButtonDisabled && addButtonInfotipContent;
-  const addButton = /* @__PURE__ */ React101.createElement(
-    IconButton9,
+  const addButton = /* @__PURE__ */ React102.createElement(
+    IconButton10,
     {
       size: SIZE9,
       sx: {
@@ -6546,11 +6607,11 @@ var Repeater3 = ({
       },
       disabled: isButtonDisabled,
       onClick: addRepeaterItem,
-      "aria-label": __50("Add item", "elementor")
+      "aria-label": __51("Add item", "elementor")
     },
-    /* @__PURE__ */ React101.createElement(PlusIcon3, { fontSize: SIZE9 })
+    /* @__PURE__ */ React102.createElement(PlusIcon3, { fontSize: SIZE9 })
   );
-  return /* @__PURE__ */ React101.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React101.createElement(RepeaterHeader, { label, adornment: ControlAdornments }, shouldShowInfotip ? /* @__PURE__ */ React101.createElement(
+  return /* @__PURE__ */ React102.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React102.createElement(RepeaterHeader, { label, adornment: ControlAdornments }, shouldShowInfotip ? /* @__PURE__ */ React102.createElement(
     Infotip4,
     {
       placement: "right",
@@ -6558,20 +6619,20 @@ var Repeater3 = ({
       color: "secondary",
       slotProps: { popper: { sx: { width: 300 } } }
     },
-    /* @__PURE__ */ React101.createElement(Box24, { sx: { ...isButtonDisabled ? { cursor: "not-allowed" } : {} } }, addButton)
-  ) : addButton), 0 < uniqueKeys.length && /* @__PURE__ */ React101.createElement(SortableProvider, { value: uniqueKeys, onChange: onChangeOrder }, uniqueKeys.map((key) => {
+    /* @__PURE__ */ React102.createElement(Box25, { sx: { ...isButtonDisabled ? { cursor: "not-allowed" } : {} } }, addButton)
+  ) : addButton), 0 < uniqueKeys.length && /* @__PURE__ */ React102.createElement(SortableProvider, { value: uniqueKeys, onChange: onChangeOrder }, uniqueKeys.map((key) => {
     const index = uniqueKeys.indexOf(key);
     const value = items2[index];
     if (!value) {
       return null;
     }
-    return /* @__PURE__ */ React101.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React101.createElement(
+    return /* @__PURE__ */ React102.createElement(SortableItem, { id: key, key: `sortable-${key}`, disabled: !isSortable }, /* @__PURE__ */ React102.createElement(
       RepeaterItem,
       {
         disabled,
         propDisabled: value?.disabled,
-        label: /* @__PURE__ */ React101.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React101.createElement(itemSettings.Label, { value, index })),
-        startIcon: /* @__PURE__ */ React101.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React101.createElement(itemSettings.Icon, { value })),
+        label: /* @__PURE__ */ React102.createElement(RepeaterItemLabelSlot, { value }, /* @__PURE__ */ React102.createElement(itemSettings.Label, { value, index })),
+        startIcon: /* @__PURE__ */ React102.createElement(RepeaterItemIconSlot, { value }, /* @__PURE__ */ React102.createElement(itemSettings.Icon, { value })),
         removeItem: () => removeRepeaterItem(index),
         duplicateItem: () => duplicateRepeaterItem(index),
         toggleDisableItem: () => toggleDisableRepeaterItem(index),
@@ -6583,7 +6644,7 @@ var Repeater3 = ({
         actions: itemSettings.actions,
         value
       },
-      (props) => /* @__PURE__ */ React101.createElement(
+      (props) => /* @__PURE__ */ React102.createElement(
         itemSettings.Content,
         {
           ...props,
@@ -6613,24 +6674,24 @@ var RepeaterItem = ({
   value
 }) => {
   const { popoverState, popoverProps, ref, setRef } = usePopover(openOnMount, onOpen);
-  const duplicateLabel = __50("Duplicate", "elementor");
-  const toggleLabel = propDisabled ? __50("Show", "elementor") : __50("Hide", "elementor");
-  const removeLabel = __50("Remove", "elementor");
-  return /* @__PURE__ */ React101.createElement(React101.Fragment, null, /* @__PURE__ */ React101.createElement(
+  const duplicateLabel = __51("Duplicate", "elementor");
+  const toggleLabel = propDisabled ? __51("Show", "elementor") : __51("Hide", "elementor");
+  const removeLabel = __51("Remove", "elementor");
+  return /* @__PURE__ */ React102.createElement(React102.Fragment, null, /* @__PURE__ */ React102.createElement(
     RepeaterTag,
     {
       disabled,
       label,
       ref: setRef,
-      "aria-label": __50("Open item", "elementor"),
+      "aria-label": __51("Open item", "elementor"),
       ...bindTrigger6(popoverState),
       startIcon,
-      actions: /* @__PURE__ */ React101.createElement(React101.Fragment, null, showDuplicate && /* @__PURE__ */ React101.createElement(Tooltip10, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React101.createElement(IconButton9, { size: SIZE9, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React101.createElement(CopyIcon2, { fontSize: SIZE9 }))), showToggle && /* @__PURE__ */ React101.createElement(Tooltip10, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React101.createElement(IconButton9, { size: SIZE9, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React101.createElement(EyeOffIcon2, { fontSize: SIZE9 }) : /* @__PURE__ */ React101.createElement(EyeIcon2, { fontSize: SIZE9 }))), actions?.(value), showRemove && /* @__PURE__ */ React101.createElement(Tooltip10, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React101.createElement(IconButton9, { size: SIZE9, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React101.createElement(XIcon4, { fontSize: SIZE9 }))))
+      actions: /* @__PURE__ */ React102.createElement(React102.Fragment, null, showDuplicate && /* @__PURE__ */ React102.createElement(Tooltip11, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React102.createElement(IconButton10, { size: SIZE9, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React102.createElement(CopyIcon2, { fontSize: SIZE9 }))), showToggle && /* @__PURE__ */ React102.createElement(Tooltip11, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React102.createElement(IconButton10, { size: SIZE9, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React102.createElement(EyeOffIcon2, { fontSize: SIZE9 }) : /* @__PURE__ */ React102.createElement(EyeIcon2, { fontSize: SIZE9 }))), actions?.(value), showRemove && /* @__PURE__ */ React102.createElement(Tooltip11, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React102.createElement(IconButton10, { size: SIZE9, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React102.createElement(XIcon4, { fontSize: SIZE9 }))))
     }
-  ), /* @__PURE__ */ React101.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React101.createElement(Box24, null, children({ anchorEl: ref }))));
+  ), /* @__PURE__ */ React102.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React102.createElement(Box25, null, children({ anchorEl: ref }))));
 };
 var usePopover = (openOnMount, onOpen) => {
-  const [ref, setRef] = useState17(null);
+  const [ref, setRef] = useState18(null);
   const popoverState = usePopupState8({ variant: "popover" });
   const popoverProps = bindPopover7(popoverState);
   useEffect12(() => {
@@ -6648,8 +6709,8 @@ var usePopover = (openOnMount, onOpen) => {
 };
 
 // src/components/inline-editor-toolbar.tsx
-import * as React103 from "react";
-import { useMemo as useMemo15, useRef as useRef26, useState as useState18 } from "react";
+import * as React104 from "react";
+import { useMemo as useMemo15, useRef as useRef26, useState as useState19 } from "react";
 import { getElementSetting } from "@elementor/editor-elements";
 import {
   BoldIcon,
@@ -6662,23 +6723,23 @@ import {
   UnderlineIcon
 } from "@elementor/icons";
 import {
-  Box as Box25,
-  IconButton as IconButton10,
+  Box as Box26,
+  IconButton as IconButton11,
   ToggleButton as ToggleButton3,
   ToggleButtonGroup as ToggleButtonGroup2,
   toggleButtonGroupClasses,
-  Tooltip as Tooltip12,
+  Tooltip as Tooltip13,
   usePopupState as usePopupState9
 } from "@elementor/ui";
 import { useEditorState } from "@tiptap/react";
-import { __ as __52 } from "@wordpress/i18n";
+import { __ as __53 } from "@wordpress/i18n";
 
 // src/components/url-popover.tsx
-import * as React102 from "react";
+import * as React103 from "react";
 import { useEffect as useEffect13, useRef as useRef25 } from "react";
 import { ExternalLinkIcon } from "@elementor/icons";
-import { bindPopover as bindPopover8, Popover as Popover7, Stack as Stack16, TextField as TextField8, ToggleButton as ToggleButton2, Tooltip as Tooltip11 } from "@elementor/ui";
-import { __ as __51 } from "@wordpress/i18n";
+import { bindPopover as bindPopover8, Popover as Popover7, Stack as Stack17, TextField as TextField8, ToggleButton as ToggleButton2, Tooltip as Tooltip12 } from "@elementor/ui";
+import { __ as __52 } from "@wordpress/i18n";
 var UrlPopover = ({
   popupState,
   restoreValue,
@@ -6698,7 +6759,7 @@ var UrlPopover = ({
     restoreValue();
     popupState.close();
   };
-  return /* @__PURE__ */ React102.createElement(
+  return /* @__PURE__ */ React103.createElement(
     Popover7,
     {
       slotProps: {
@@ -6709,38 +6770,38 @@ var UrlPopover = ({
       transformOrigin: { vertical: "top", horizontal: "left" },
       onClose: handleClose
     },
-    /* @__PURE__ */ React102.createElement(Stack16, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React102.createElement(
+    /* @__PURE__ */ React103.createElement(Stack17, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React103.createElement(
       TextField8,
       {
         value,
         onChange,
         size: "tiny",
         fullWidth: true,
-        placeholder: __51("Type a URL", "elementor"),
+        placeholder: __52("Type a URL", "elementor"),
         inputProps: { ref: inputRef },
         color: "secondary",
         InputProps: { sx: { borderRadius: "8px" } },
         onKeyUp: (event) => event.key === "Enter" && handleClose()
       }
-    ), /* @__PURE__ */ React102.createElement(Tooltip11, { title: __51("Open in a new tab", "elementor") }, /* @__PURE__ */ React102.createElement(
+    ), /* @__PURE__ */ React103.createElement(Tooltip12, { title: __52("Open in a new tab", "elementor") }, /* @__PURE__ */ React103.createElement(
       ToggleButton2,
       {
         size: "tiny",
         value: "newTab",
         selected: openInNewTab,
         onClick: onToggleNewTab,
-        "aria-label": __51("Open in a new tab", "elementor"),
+        "aria-label": __52("Open in a new tab", "elementor"),
         sx: { borderRadius: "8px" }
       },
-      /* @__PURE__ */ React102.createElement(ExternalLinkIcon, { fontSize: "tiny" })
+      /* @__PURE__ */ React103.createElement(ExternalLinkIcon, { fontSize: "tiny" })
     )))
   );
 };
 
 // src/components/inline-editor-toolbar.tsx
 var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
-  const [urlValue, setUrlValue] = useState18("");
-  const [openInNewTab, setOpenInNewTab] = useState18(false);
+  const [urlValue, setUrlValue] = useState19("");
+  const [openInNewTab, setOpenInNewTab] = useState19(false);
   const toolbarRef = useRef26(null);
   const linkPopupState = usePopupState9({ variant: "popover" });
   const hasLinkOnElement = elementId ? checkIfElementHasLink(elementId) : false;
@@ -6785,11 +6846,11 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
     }
     linkPopupState.close();
   };
-  React103.useEffect(() => {
+  React104.useEffect(() => {
     editor?.commands?.focus();
   }, [editor]);
-  return /* @__PURE__ */ React103.createElement(
-    Box25,
+  return /* @__PURE__ */ React104.createElement(
+    Box26,
     {
       ref: toolbarRef,
       sx: {
@@ -6805,8 +6866,8 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
         ...sx
       }
     },
-    /* @__PURE__ */ React103.createElement(Tooltip12, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React103.createElement(IconButton10, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
-    /* @__PURE__ */ React103.createElement(
+    /* @__PURE__ */ React104.createElement(Tooltip13, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React104.createElement(IconButton11, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
+    /* @__PURE__ */ React104.createElement(
       ToggleButtonGroup2,
       {
         value: editorState,
@@ -6828,7 +6889,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
           }
         }
       },
-      formatButtonsList.map((button) => /* @__PURE__ */ React103.createElement(Tooltip12, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React103.createElement(
+      formatButtonsList.map((button) => /* @__PURE__ */ React104.createElement(Tooltip13, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React104.createElement(
         ToggleButton3,
         {
           value: button.action,
@@ -6846,7 +6907,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
         button.icon
       )))
     ),
-    /* @__PURE__ */ React103.createElement(
+    /* @__PURE__ */ React104.createElement(
       UrlPopover,
       {
         popupState: linkPopupState,
@@ -6863,64 +6924,64 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
 var checkIfElementHasLink = (elementId) => !!getElementSetting(elementId, "link")?.value?.destination;
 var toolbarButtons = {
   clear: {
-    label: __52("Clear", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(MinusIcon2, { fontSize: "tiny" }),
+    label: __53("Clear", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(MinusIcon2, { fontSize: "tiny" }),
     action: "clear",
     method: (editor) => {
       editor.chain().focus().clearNodes().unsetAllMarks().run();
     }
   },
   bold: {
-    label: __52("Bold", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(BoldIcon, { fontSize: "tiny" }),
+    label: __53("Bold", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(BoldIcon, { fontSize: "tiny" }),
     action: "bold",
     method: (editor) => {
       editor.chain().focus().toggleBold().run();
     }
   },
   italic: {
-    label: __52("Italic", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(ItalicIcon, { fontSize: "tiny" }),
+    label: __53("Italic", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(ItalicIcon, { fontSize: "tiny" }),
     action: "italic",
     method: (editor) => {
       editor.chain().focus().toggleItalic().run();
     }
   },
   underline: {
-    label: __52("Underline", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(UnderlineIcon, { fontSize: "tiny" }),
+    label: __53("Underline", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(UnderlineIcon, { fontSize: "tiny" }),
     action: "underline",
     method: (editor) => {
       editor.chain().focus().toggleUnderline().run();
     }
   },
   strike: {
-    label: __52("Strikethrough", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(StrikethroughIcon, { fontSize: "tiny" }),
+    label: __53("Strikethrough", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(StrikethroughIcon, { fontSize: "tiny" }),
     action: "strike",
     method: (editor) => {
       editor.chain().focus().toggleStrike().run();
     }
   },
   superscript: {
-    label: __52("Superscript", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(SuperscriptIcon, { fontSize: "tiny" }),
+    label: __53("Superscript", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(SuperscriptIcon, { fontSize: "tiny" }),
     action: "superscript",
     method: (editor) => {
       editor.chain().focus().toggleSuperscript().run();
     }
   },
   subscript: {
-    label: __52("Subscript", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(SubscriptIcon, { fontSize: "tiny" }),
+    label: __53("Subscript", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(SubscriptIcon, { fontSize: "tiny" }),
     action: "subscript",
     method: (editor) => {
       editor.chain().focus().toggleSubscript().run();
     }
   },
   link: {
-    label: __52("Link", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(LinkIcon3, { fontSize: "tiny" }),
+    label: __53("Link", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(LinkIcon3, { fontSize: "tiny" }),
     action: "link",
     method: null
   }
@@ -6929,7 +6990,7 @@ var { clear: clearButton, ...formatButtons } = toolbarButtons;
 var possibleFormats = Object.keys(formatButtons);
 
 // src/components/size/unstable-size-field.tsx
-import * as React106 from "react";
+import * as React107 from "react";
 import { InputAdornment as InputAdornment5 } from "@elementor/ui";
 
 // src/hooks/use-size-value.ts
@@ -6970,7 +7031,7 @@ var differsFromExternal = (newState, externalState) => {
 };
 
 // src/components/size/unit-select.tsx
-import * as React104 from "react";
+import * as React105 from "react";
 import { useId as useId3 } from "react";
 import { MenuListItem as MenuListItem7 } from "@elementor/editor-ui";
 import { bindMenu as bindMenu2, bindTrigger as bindTrigger7, Button as Button5, Menu as Menu3, styled as styled10, usePopupState as usePopupState10 } from "@elementor/ui";
@@ -6988,7 +7049,7 @@ var UnitSelect = ({ value, showPrimaryColor, onClick, options }) => {
     onClick(options[index]);
     popupState.close();
   };
-  return /* @__PURE__ */ React104.createElement(React104.Fragment, null, /* @__PURE__ */ React104.createElement(StyledButton2, { isPrimaryColor: showPrimaryColor, size: "small", ...bindTrigger7(popupState) }, value), /* @__PURE__ */ React104.createElement(Menu3, { MenuListProps: { dense: true }, ...bindMenu2(popupState) }, options.map((option, index) => /* @__PURE__ */ React104.createElement(
+  return /* @__PURE__ */ React105.createElement(React105.Fragment, null, /* @__PURE__ */ React105.createElement(StyledButton2, { isPrimaryColor: showPrimaryColor, size: "small", ...bindTrigger7(popupState) }, value), /* @__PURE__ */ React105.createElement(Menu3, { MenuListProps: { dense: true }, ...bindMenu2(popupState) }, options.map((option, index) => /* @__PURE__ */ React105.createElement(
     MenuListItem7,
     {
       key: option,
@@ -7017,11 +7078,11 @@ var StyledButton2 = styled10(Button5, {
 }));
 
 // src/components/size/unstable-size-input.tsx
-import * as React105 from "react";
+import * as React106 from "react";
 import { forwardRef as forwardRef11 } from "react";
 var UnstableSizeInput = forwardRef11(
   ({ type, value, onChange, onKeyDown, onKeyUp, InputProps, onBlur, focused, disabled }, ref) => {
-    return /* @__PURE__ */ React105.createElement(
+    return /* @__PURE__ */ React106.createElement(
       NumberInput,
       {
         ref,
@@ -7065,7 +7126,7 @@ var UnstableSizeField = ({
   const shouldHighlightUnit = () => {
     return hasValue(size);
   };
-  return /* @__PURE__ */ React106.createElement(
+  return /* @__PURE__ */ React107.createElement(
     UnstableSizeInput,
     {
       type: "number",
@@ -7074,7 +7135,7 @@ var UnstableSizeField = ({
       onChange: (event) => setSize(event.target.value),
       InputProps: {
         ...InputProps,
-        endAdornment: /* @__PURE__ */ React106.createElement(InputAdornment5, { position: "end" }, /* @__PURE__ */ React106.createElement(
+        endAdornment: /* @__PURE__ */ React107.createElement(InputAdornment5, { position: "end" }, /* @__PURE__ */ React107.createElement(
           UnitSelect,
           {
             options: units2,
@@ -7094,11 +7155,11 @@ var hasValue = (value) => {
 // src/hooks/use-font-families.ts
 import { useMemo as useMemo16 } from "react";
 import { getElementorConfig } from "@elementor/editor-v1-adapters";
-import { __ as __53 } from "@wordpress/i18n";
+import { __ as __54 } from "@wordpress/i18n";
 var supportedCategories = {
-  system: __53("System", "elementor"),
-  custom: __53("Custom Fonts", "elementor"),
-  googlefonts: __53("Google Fonts", "elementor")
+  system: __54("System", "elementor"),
+  custom: __54("Custom Fonts", "elementor"),
+  googlefonts: __54("Google Fonts", "elementor")
 };
 var getFontFamilies = () => {
   const { controls } = getElementorConfig();
@@ -7141,6 +7202,7 @@ export {
   ControlReplacementsProvider,
   ControlToggleButtonGroup,
   DateTimeControl,
+  DisplayConditionsControl,
   EqualUnequalSizesControl,
   FilterRepeaterControl,
   FontFamilyControl,