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

package/dist/index.d.mts

@@ -389,6 +389,8 @@ declare const InlineEditingControl: ControlComponent$1<({ sx, attributes, props,
     props?: ComponentProps<"div">;
 }) => React$1.JSX.Element>;
 
+declare const DisplayConditionsControl: ControlComponent$1<() => React$1.JSX.Element>;
+
 declare const ControlFormLabel: (props: FormLabelProps) => React$1.JSX.Element;
 
 type ClearIconButtonProps = {
@@ -677,4 +679,4 @@ declare const useElementCanHaveChildren: () => boolean;
 
 declare const useFontFamilies: () => FontCategory[];
 
-export { type AdornmentComponent, type AngleUnit, AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ClearIconButton, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent$1 as ControlComponent, ControlFormLabel, type ControlReplacement, ControlReplacementsProvider, ControlToggleButtonGroup, DateTimeControl, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, FilterRepeaterControl, type FontCategory, FontFamilyControl, GapControl, HtmlTagControl, ImageControl, InlineEditingControl, InlineEditor, InlineEditorToolbar, type InlineEditorToolbarProps, ItemSelector, type ItemsActionPayload, KeyValueControl, type LengthUnit, LinkControl, LinkedDimensionsControl, NumberControl, PopoverContent, PopoverGridContainer, PositionControl, PropKeyProvider, PropProvider, type PropProviderProps, QueryControl, RepeatableControl, Repeater, type RepeaterItem, SelectControl, SelectControlWrapper, type SetRepeaterValuesMeta, type SetValue, type SetValueMeta, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type TimeUnit, type ToggleButtonGroupItem, ToggleButtonGroupUi, ToggleControl, type ToggleControlProps, TransformRepeaterControl, TransformSettingsControl, TransitionRepeaterControl, type Unit, UnstableSizeField, UrlControl, createControl, createControlReplacementsRegistry, enqueueFont, getControlReplacements, injectIntoRepeaterItemActions, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, registerControlReplacement, transitionProperties, transitionsItemsList, useBoundProp, useControlActions, useControlReplacement, useElementCanHaveChildren, useFontFamilies, useSyncExternalState };
+export { type AdornmentComponent, type AngleUnit, AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ClearIconButton, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent$1 as ControlComponent, ControlFormLabel, type ControlReplacement, ControlReplacementsProvider, ControlToggleButtonGroup, DateTimeControl, DisplayConditionsControl, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, FilterRepeaterControl, type FontCategory, FontFamilyControl, GapControl, HtmlTagControl, ImageControl, InlineEditingControl, InlineEditor, InlineEditorToolbar, type InlineEditorToolbarProps, ItemSelector, type ItemsActionPayload, KeyValueControl, type LengthUnit, LinkControl, LinkedDimensionsControl, NumberControl, PopoverContent, PopoverGridContainer, PositionControl, PropKeyProvider, PropProvider, type PropProviderProps, QueryControl, RepeatableControl, Repeater, type RepeaterItem, SelectControl, SelectControlWrapper, type SetRepeaterValuesMeta, type SetValue, type SetValueMeta, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type TimeUnit, type ToggleButtonGroupItem, ToggleButtonGroupUi, ToggleControl, type ToggleControlProps, TransformRepeaterControl, TransformSettingsControl, TransitionRepeaterControl, type Unit, UnstableSizeField, UrlControl, createControl, createControlReplacementsRegistry, enqueueFont, getControlReplacements, injectIntoRepeaterItemActions, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, registerControlReplacement, transitionProperties, transitionsItemsList, useBoundProp, useControlActions, useControlReplacement, useElementCanHaveChildren, useFontFamilies, useSyncExternalState };

package/dist/index.d.ts

@@ -389,6 +389,8 @@ declare const InlineEditingControl: ControlComponent$1<({ sx, attributes, props,
     props?: ComponentProps<"div">;
 }) => React$1.JSX.Element>;
 
+declare const DisplayConditionsControl: ControlComponent$1<() => React$1.JSX.Element>;
+
 declare const ControlFormLabel: (props: FormLabelProps) => React$1.JSX.Element;
 
 type ClearIconButtonProps = {
@@ -677,4 +679,4 @@ declare const useElementCanHaveChildren: () => boolean;
 
 declare const useFontFamilies: () => FontCategory[];
 
-export { type AdornmentComponent, type AngleUnit, AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ClearIconButton, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent$1 as ControlComponent, ControlFormLabel, type ControlReplacement, ControlReplacementsProvider, ControlToggleButtonGroup, DateTimeControl, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, FilterRepeaterControl, type FontCategory, FontFamilyControl, GapControl, HtmlTagControl, ImageControl, InlineEditingControl, InlineEditor, InlineEditorToolbar, type InlineEditorToolbarProps, ItemSelector, type ItemsActionPayload, KeyValueControl, type LengthUnit, LinkControl, LinkedDimensionsControl, NumberControl, PopoverContent, PopoverGridContainer, PositionControl, PropKeyProvider, PropProvider, type PropProviderProps, QueryControl, RepeatableControl, Repeater, type RepeaterItem, SelectControl, SelectControlWrapper, type SetRepeaterValuesMeta, type SetValue, type SetValueMeta, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type TimeUnit, type ToggleButtonGroupItem, ToggleButtonGroupUi, ToggleControl, type ToggleControlProps, TransformRepeaterControl, TransformSettingsControl, TransitionRepeaterControl, type Unit, UnstableSizeField, UrlControl, createControl, createControlReplacementsRegistry, enqueueFont, getControlReplacements, injectIntoRepeaterItemActions, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, registerControlReplacement, transitionProperties, transitionsItemsList, useBoundProp, useControlActions, useControlReplacement, useElementCanHaveChildren, useFontFamilies, useSyncExternalState };
+export { type AdornmentComponent, type AngleUnit, AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ClearIconButton, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent$1 as ControlComponent, ControlFormLabel, type ControlReplacement, ControlReplacementsProvider, ControlToggleButtonGroup, DateTimeControl, DisplayConditionsControl, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedOption, FilterRepeaterControl, type FontCategory, FontFamilyControl, GapControl, HtmlTagControl, ImageControl, InlineEditingControl, InlineEditor, InlineEditorToolbar, type InlineEditorToolbarProps, ItemSelector, type ItemsActionPayload, KeyValueControl, type LengthUnit, LinkControl, LinkedDimensionsControl, NumberControl, PopoverContent, PopoverGridContainer, PositionControl, PropKeyProvider, PropProvider, type PropProviderProps, QueryControl, RepeatableControl, Repeater, type RepeaterItem, SelectControl, SelectControlWrapper, type SetRepeaterValuesMeta, type SetValue, type SetValueMeta, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type TimeUnit, type ToggleButtonGroupItem, ToggleButtonGroupUi, ToggleControl, type ToggleControlProps, TransformRepeaterControl, TransformSettingsControl, TransitionRepeaterControl, type Unit, UnstableSizeField, UrlControl, createControl, createControlReplacementsRegistry, enqueueFont, getControlReplacements, injectIntoRepeaterItemActions, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, registerControlReplacement, transitionProperties, transitionsItemsList, useBoundProp, useControlActions, useControlReplacement, useElementCanHaveChildren, useFontFamilies, useSyncExternalState };

package/dist/index.js

@@ -42,6 +42,7 @@ __export(index_exports, {
   ControlReplacementsProvider: () => ControlReplacementsProvider,
   ControlToggleButtonGroup: () => ControlToggleButtonGroup,
   DateTimeControl: () => DateTimeControl,
+  DisplayConditionsControl: () => DisplayConditionsControl,
   EqualUnequalSizesControl: () => EqualUnequalSizesControl,
   FilterRepeaterControl: () => FilterRepeaterControl,
   FontFamilyControl: () => FontFamilyControl,
@@ -6440,22 +6441,83 @@ var InlineEditingControl = createControl(
   }
 );
 
-// src/components/icon-buttons/clear-icon-button.tsx
+// src/components/promotions/display-conditions-control.tsx
 var React100 = __toESM(require("react"));
+var import_react54 = require("react");
+var import_editor_ui13 = require("@elementor/editor-ui");
 var import_icons33 = require("@elementor/icons");
 var import_ui86 = require("@elementor/ui");
-var CustomIconButton = (0, import_ui86.styled)(import_ui86.IconButton)(({ theme }) => ({
+var import_i18n50 = require("@wordpress/i18n");
+var ARIA_LABEL = (0, import_i18n50.__)("Display Conditions", "elementor");
+function getDisplayConditionPromotion() {
+  return window.elementor?.config?.v4Promotions?.displayConditions;
+}
+var DisplayConditionsControl = createControl(() => {
+  const [isInfotipOpen, setIsInfotipOpen] = (0, import_react54.useState)(false);
+  const promotion = getDisplayConditionPromotion();
+  return /* @__PURE__ */ React100.createElement(
+    import_ui86.Stack,
+    {
+      direction: "row",
+      spacing: 2,
+      sx: {
+        justifyContent: "flex-end",
+        alignItems: "center"
+      }
+    },
+    /* @__PURE__ */ React100.createElement(
+      import_editor_ui13.PromotionInfotip,
+      {
+        title: promotion?.title ?? "",
+        content: promotion?.content ?? "",
+        assetUrl: promotion?.image ?? "",
+        ctaUrl: promotion?.ctaUrl ?? "",
+        open: isInfotipOpen,
+        onClose: () => setIsInfotipOpen(false)
+      },
+      /* @__PURE__ */ React100.createElement(
+        import_ui86.Box,
+        {
+          onClick: () => setIsInfotipOpen((prev) => !prev),
+          sx: { cursor: "pointer", display: "inline-flex" }
+        },
+        /* @__PURE__ */ React100.createElement(import_editor_ui13.PromotionChip, null)
+      )
+    ),
+    /* @__PURE__ */ React100.createElement(import_ui86.Tooltip, { title: ARIA_LABEL, placement: "top" }, /* @__PURE__ */ React100.createElement(
+      import_ui86.IconButton,
+      {
+        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(import_icons33.SitemapIcon, { fontSize: "tiny", color: "disabled" })
+    ))
+  );
+});
+
+// src/components/icon-buttons/clear-icon-button.tsx
+var React101 = __toESM(require("react"));
+var import_icons34 = require("@elementor/icons");
+var import_ui87 = require("@elementor/ui");
+var CustomIconButton = (0, import_ui87.styled)(import_ui87.IconButton)(({ theme }) => ({
   width: theme.spacing(2.5),
   height: theme.spacing(2.5)
 }));
-var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React100.createElement(import_ui86.Tooltip, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React100.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React100.createElement(import_icons33.BrushBigIcon, { fontSize: size })));
+var ClearIconButton = ({ tooltipText, onClick, disabled, size = "tiny" }) => /* @__PURE__ */ React101.createElement(import_ui87.Tooltip, { title: tooltipText, placement: "top", disableInteractive: true }, /* @__PURE__ */ React101.createElement(CustomIconButton, { "aria-label": tooltipText, size, onClick, disabled }, /* @__PURE__ */ React101.createElement(import_icons34.BrushBigIcon, { fontSize: size })));
 
 // src/components/repeater/repeater.tsx
-var React101 = __toESM(require("react"));
-var import_react54 = require("react");
-var import_icons34 = require("@elementor/icons");
-var import_ui87 = require("@elementor/ui");
-var import_i18n50 = require("@wordpress/i18n");
+var React102 = __toESM(require("react"));
+var import_react55 = require("react");
+var import_icons35 = require("@elementor/icons");
+var import_ui88 = require("@elementor/ui");
+var import_i18n51 = require("@wordpress/i18n");
 var SIZE9 = "tiny";
 var EMPTY_OPEN_ITEM2 = -1;
 var Repeater3 = ({
@@ -6473,7 +6535,7 @@ var Repeater3 = ({
   openItem: initialOpenItem = EMPTY_OPEN_ITEM2,
   isSortable = true
 }) => {
-  const [openItem, setOpenItem] = (0, import_react54.useState)(initialOpenItem);
+  const [openItem, setOpenItem] = (0, import_react55.useState)(initialOpenItem);
   const uniqueKeys = items2.map(
     (item, index) => isSortable && "getId" in itemSettings ? itemSettings.getId({ item, index }) : String(index)
   );
@@ -6536,8 +6598,8 @@ var Repeater3 = ({
   };
   const isButtonDisabled = disabled || disableAddItemButton;
   const shouldShowInfotip = isButtonDisabled && addButtonInfotipContent;
-  const addButton = /* @__PURE__ */ React101.createElement(
-    import_ui87.IconButton,
+  const addButton = /* @__PURE__ */ React102.createElement(
+    import_ui88.IconButton,
     {
       size: SIZE9,
       sx: {
@@ -6545,32 +6607,32 @@ var Repeater3 = ({
       },
       disabled: isButtonDisabled,
       onClick: addRepeaterItem,
-      "aria-label": (0, import_i18n50.__)("Add item", "elementor")
+      "aria-label": (0, import_i18n51.__)("Add item", "elementor")
     },
-    /* @__PURE__ */ React101.createElement(import_icons34.PlusIcon, { fontSize: SIZE9 })
+    /* @__PURE__ */ React102.createElement(import_icons35.PlusIcon, { fontSize: SIZE9 })
   );
-  return /* @__PURE__ */ React101.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React101.createElement(RepeaterHeader, { label, adornment: ControlAdornments }, shouldShowInfotip ? /* @__PURE__ */ React101.createElement(
-    import_ui87.Infotip,
+  return /* @__PURE__ */ React102.createElement(SectionContent, { gap: 2 }, /* @__PURE__ */ React102.createElement(RepeaterHeader, { label, adornment: ControlAdornments }, shouldShowInfotip ? /* @__PURE__ */ React102.createElement(
+    import_ui88.Infotip,
     {
       placement: "right",
       content: addButtonInfotipContent,
       color: "secondary",
       slotProps: { popper: { sx: { width: 300 } } }
     },
-    /* @__PURE__ */ React101.createElement(import_ui87.Box, { sx: { ...isButtonDisabled ? { cursor: "not-allowed" } : {} } }, addButton)
-  ) : addButton), 0 < uniqueKeys.length && /* @__PURE__ */ React101.createElement(SortableProvider, { value: uniqueKeys, onChange: onChangeOrder }, uniqueKeys.map((key) => {
+    /* @__PURE__ */ React102.createElement(import_ui88.Box, { 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),
@@ -6582,7 +6644,7 @@ var Repeater3 = ({
         actions: itemSettings.actions,
         value
       },
-      (props) => /* @__PURE__ */ React101.createElement(
+      (props) => /* @__PURE__ */ React102.createElement(
         itemSettings.Content,
         {
           ...props,
@@ -6612,27 +6674,27 @@ var RepeaterItem = ({
   value
 }) => {
   const { popoverState, popoverProps, ref, setRef } = usePopover(openOnMount, onOpen);
-  const duplicateLabel = (0, import_i18n50.__)("Duplicate", "elementor");
-  const toggleLabel = propDisabled ? (0, import_i18n50.__)("Show", "elementor") : (0, import_i18n50.__)("Hide", "elementor");
-  const removeLabel = (0, import_i18n50.__)("Remove", "elementor");
-  return /* @__PURE__ */ React101.createElement(React101.Fragment, null, /* @__PURE__ */ React101.createElement(
+  const duplicateLabel = (0, import_i18n51.__)("Duplicate", "elementor");
+  const toggleLabel = propDisabled ? (0, import_i18n51.__)("Show", "elementor") : (0, import_i18n51.__)("Hide", "elementor");
+  const removeLabel = (0, import_i18n51.__)("Remove", "elementor");
+  return /* @__PURE__ */ React102.createElement(React102.Fragment, null, /* @__PURE__ */ React102.createElement(
     RepeaterTag,
     {
       disabled,
       label,
       ref: setRef,
-      "aria-label": (0, import_i18n50.__)("Open item", "elementor"),
-      ...(0, import_ui87.bindTrigger)(popoverState),
+      "aria-label": (0, import_i18n51.__)("Open item", "elementor"),
+      ...(0, import_ui88.bindTrigger)(popoverState),
       startIcon,
-      actions: /* @__PURE__ */ React101.createElement(React101.Fragment, null, showDuplicate && /* @__PURE__ */ React101.createElement(import_ui87.Tooltip, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React101.createElement(import_ui87.IconButton, { size: SIZE9, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React101.createElement(import_icons34.CopyIcon, { fontSize: SIZE9 }))), showToggle && /* @__PURE__ */ React101.createElement(import_ui87.Tooltip, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React101.createElement(import_ui87.IconButton, { size: SIZE9, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React101.createElement(import_icons34.EyeOffIcon, { fontSize: SIZE9 }) : /* @__PURE__ */ React101.createElement(import_icons34.EyeIcon, { fontSize: SIZE9 }))), actions?.(value), showRemove && /* @__PURE__ */ React101.createElement(import_ui87.Tooltip, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React101.createElement(import_ui87.IconButton, { size: SIZE9, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React101.createElement(import_icons34.XIcon, { fontSize: SIZE9 }))))
+      actions: /* @__PURE__ */ React102.createElement(React102.Fragment, null, showDuplicate && /* @__PURE__ */ React102.createElement(import_ui88.Tooltip, { title: duplicateLabel, placement: "top" }, /* @__PURE__ */ React102.createElement(import_ui88.IconButton, { size: SIZE9, onClick: duplicateItem, "aria-label": duplicateLabel }, /* @__PURE__ */ React102.createElement(import_icons35.CopyIcon, { fontSize: SIZE9 }))), showToggle && /* @__PURE__ */ React102.createElement(import_ui88.Tooltip, { title: toggleLabel, placement: "top" }, /* @__PURE__ */ React102.createElement(import_ui88.IconButton, { size: SIZE9, onClick: toggleDisableItem, "aria-label": toggleLabel }, propDisabled ? /* @__PURE__ */ React102.createElement(import_icons35.EyeOffIcon, { fontSize: SIZE9 }) : /* @__PURE__ */ React102.createElement(import_icons35.EyeIcon, { fontSize: SIZE9 }))), actions?.(value), showRemove && /* @__PURE__ */ React102.createElement(import_ui88.Tooltip, { title: removeLabel, placement: "top" }, /* @__PURE__ */ React102.createElement(import_ui88.IconButton, { size: SIZE9, onClick: removeItem, "aria-label": removeLabel }, /* @__PURE__ */ React102.createElement(import_icons35.XIcon, { fontSize: SIZE9 }))))
     }
-  ), /* @__PURE__ */ React101.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React101.createElement(import_ui87.Box, null, children({ anchorEl: ref }))));
+  ), /* @__PURE__ */ React102.createElement(RepeaterPopover, { width: ref?.getBoundingClientRect().width, ...popoverProps, anchorEl: ref }, /* @__PURE__ */ React102.createElement(import_ui88.Box, null, children({ anchorEl: ref }))));
 };
 var usePopover = (openOnMount, onOpen) => {
-  const [ref, setRef] = (0, import_react54.useState)(null);
-  const popoverState = (0, import_ui87.usePopupState)({ variant: "popover" });
-  const popoverProps = (0, import_ui87.bindPopover)(popoverState);
-  (0, import_react54.useEffect)(() => {
+  const [ref, setRef] = (0, import_react55.useState)(null);
+  const popoverState = (0, import_ui88.usePopupState)({ variant: "popover" });
+  const popoverProps = (0, import_ui88.bindPopover)(popoverState);
+  (0, import_react55.useEffect)(() => {
     if (openOnMount && ref) {
       popoverState.open(ref);
       onOpen?.();
@@ -6647,20 +6709,20 @@ var usePopover = (openOnMount, onOpen) => {
 };
 
 // src/components/inline-editor-toolbar.tsx
+var React104 = __toESM(require("react"));
+var import_react57 = require("react");
+var import_editor_elements6 = require("@elementor/editor-elements");
+var import_icons37 = require("@elementor/icons");
+var import_ui90 = require("@elementor/ui");
+var import_react58 = require("@tiptap/react");
+var import_i18n53 = require("@wordpress/i18n");
+
+// src/components/url-popover.tsx
 var React103 = __toESM(require("react"));
 var import_react56 = require("react");
-var import_editor_elements6 = require("@elementor/editor-elements");
 var import_icons36 = require("@elementor/icons");
 var import_ui89 = require("@elementor/ui");
-var import_react57 = require("@tiptap/react");
 var import_i18n52 = require("@wordpress/i18n");
-
-// src/components/url-popover.tsx
-var React102 = __toESM(require("react"));
-var import_react55 = require("react");
-var import_icons35 = require("@elementor/icons");
-var import_ui88 = require("@elementor/ui");
-var import_i18n51 = require("@wordpress/i18n");
 var UrlPopover = ({
   popupState,
   restoreValue,
@@ -6670,8 +6732,8 @@ var UrlPopover = ({
   openInNewTab,
   onToggleNewTab
 }) => {
-  const inputRef = (0, import_react55.useRef)(null);
-  (0, import_react55.useEffect)(() => {
+  const inputRef = (0, import_react56.useRef)(null);
+  (0, import_react56.useEffect)(() => {
     if (popupState.isOpen) {
       requestAnimationFrame(() => inputRef.current?.focus());
     }
@@ -6680,57 +6742,57 @@ var UrlPopover = ({
     restoreValue();
     popupState.close();
   };
-  return /* @__PURE__ */ React102.createElement(
-    import_ui88.Popover,
+  return /* @__PURE__ */ React103.createElement(
+    import_ui89.Popover,
     {
       slotProps: {
         paper: { sx: { borderRadius: "16px", width: anchorRef.current?.offsetWidth + "px", marginTop: -1 } }
       },
-      ...(0, import_ui88.bindPopover)(popupState),
+      ...(0, import_ui89.bindPopover)(popupState),
       anchorOrigin: { vertical: "top", horizontal: "left" },
       transformOrigin: { vertical: "top", horizontal: "left" },
       onClose: handleClose
     },
-    /* @__PURE__ */ React102.createElement(import_ui88.Stack, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React102.createElement(
-      import_ui88.TextField,
+    /* @__PURE__ */ React103.createElement(import_ui89.Stack, { direction: "row", alignItems: "center", gap: 1, sx: { p: 1.5 } }, /* @__PURE__ */ React103.createElement(
+      import_ui89.TextField,
       {
         value,
         onChange,
         size: "tiny",
         fullWidth: true,
-        placeholder: (0, import_i18n51.__)("Type a URL", "elementor"),
+        placeholder: (0, import_i18n52.__)("Type a URL", "elementor"),
         inputProps: { ref: inputRef },
         color: "secondary",
         InputProps: { sx: { borderRadius: "8px" } },
         onKeyUp: (event) => event.key === "Enter" && handleClose()
       }
-    ), /* @__PURE__ */ React102.createElement(import_ui88.Tooltip, { title: (0, import_i18n51.__)("Open in a new tab", "elementor") }, /* @__PURE__ */ React102.createElement(
-      import_ui88.ToggleButton,
+    ), /* @__PURE__ */ React103.createElement(import_ui89.Tooltip, { title: (0, import_i18n52.__)("Open in a new tab", "elementor") }, /* @__PURE__ */ React103.createElement(
+      import_ui89.ToggleButton,
       {
         size: "tiny",
         value: "newTab",
         selected: openInNewTab,
         onClick: onToggleNewTab,
-        "aria-label": (0, import_i18n51.__)("Open in a new tab", "elementor"),
+        "aria-label": (0, import_i18n52.__)("Open in a new tab", "elementor"),
         sx: { borderRadius: "8px" }
       },
-      /* @__PURE__ */ React102.createElement(import_icons35.ExternalLinkIcon, { fontSize: "tiny" })
+      /* @__PURE__ */ React103.createElement(import_icons36.ExternalLinkIcon, { fontSize: "tiny" })
     )))
   );
 };
 
 // src/components/inline-editor-toolbar.tsx
 var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
-  const [urlValue, setUrlValue] = (0, import_react56.useState)("");
-  const [openInNewTab, setOpenInNewTab] = (0, import_react56.useState)(false);
-  const toolbarRef = (0, import_react56.useRef)(null);
-  const linkPopupState = (0, import_ui89.usePopupState)({ variant: "popover" });
+  const [urlValue, setUrlValue] = (0, import_react57.useState)("");
+  const [openInNewTab, setOpenInNewTab] = (0, import_react57.useState)(false);
+  const toolbarRef = (0, import_react57.useRef)(null);
+  const linkPopupState = (0, import_ui90.usePopupState)({ variant: "popover" });
   const hasLinkOnElement = elementId ? checkIfElementHasLink(elementId) : false;
-  const editorState = (0, import_react57.useEditorState)({
+  const editorState = (0, import_react58.useEditorState)({
     editor,
     selector: (ctx) => possibleFormats.filter((format) => ctx.editor.isActive(format))
   });
-  const formatButtonsList = (0, import_react56.useMemo)(() => {
+  const formatButtonsList = (0, import_react57.useMemo)(() => {
     const buttons = Object.values(formatButtons);
     if (hasLinkOnElement) {
       return buttons.filter((button) => button.action !== "link");
@@ -6767,11 +6829,11 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
     }
     linkPopupState.close();
   };
-  React103.useEffect(() => {
+  React104.useEffect(() => {
     editor?.commands?.focus();
   }, [editor]);
-  return /* @__PURE__ */ React103.createElement(
-    import_ui89.Box,
+  return /* @__PURE__ */ React104.createElement(
+    import_ui90.Box,
     {
       ref: toolbarRef,
       sx: {
@@ -6787,9 +6849,9 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
         ...sx
       }
     },
-    /* @__PURE__ */ React103.createElement(import_ui89.Tooltip, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React103.createElement(import_ui89.IconButton, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
-    /* @__PURE__ */ React103.createElement(
-      import_ui89.ToggleButtonGroup,
+    /* @__PURE__ */ React104.createElement(import_ui90.Tooltip, { title: clearButton.label, placement: "top", sx: { borderRadius: "8px" } }, /* @__PURE__ */ React104.createElement(import_ui90.IconButton, { "aria-label": clearButton.label, onClick: () => clearButton.method(editor), size: "tiny" }, clearButton.icon)),
+    /* @__PURE__ */ React104.createElement(
+      import_ui90.ToggleButtonGroup,
       {
         value: editorState,
         size: "tiny",
@@ -6797,7 +6859,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
           display: "flex",
           gap: 0.5,
           border: "none",
-          [`& .${import_ui89.toggleButtonGroupClasses.firstButton}, & .${import_ui89.toggleButtonGroupClasses.middleButton}, & .${import_ui89.toggleButtonGroupClasses.lastButton}`]: {
+          [`& .${import_ui90.toggleButtonGroupClasses.firstButton}, & .${import_ui90.toggleButtonGroupClasses.middleButton}, & .${import_ui90.toggleButtonGroupClasses.lastButton}`]: {
             borderRadius: "8px",
             border: "none",
             marginLeft: 0,
@@ -6810,8 +6872,8 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
           }
         }
       },
-      formatButtonsList.map((button) => /* @__PURE__ */ React103.createElement(import_ui89.Tooltip, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React103.createElement(
-        import_ui89.ToggleButton,
+      formatButtonsList.map((button) => /* @__PURE__ */ React104.createElement(import_ui90.Tooltip, { title: button.label, key: button.action, placement: "top" }, /* @__PURE__ */ React104.createElement(
+        import_ui90.ToggleButton,
         {
           value: button.action,
           "aria-label": button.label,
@@ -6828,7 +6890,7 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
         button.icon
       )))
     ),
-    /* @__PURE__ */ React103.createElement(
+    /* @__PURE__ */ React104.createElement(
       UrlPopover,
       {
         popupState: linkPopupState,
@@ -6845,64 +6907,64 @@ var InlineEditorToolbar = ({ editor, elementId, sx = {} }) => {
 var checkIfElementHasLink = (elementId) => !!(0, import_editor_elements6.getElementSetting)(elementId, "link")?.value?.destination;
 var toolbarButtons = {
   clear: {
-    label: (0, import_i18n52.__)("Clear", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(import_icons36.MinusIcon, { fontSize: "tiny" }),
+    label: (0, import_i18n53.__)("Clear", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(import_icons37.MinusIcon, { fontSize: "tiny" }),
     action: "clear",
     method: (editor) => {
       editor.chain().focus().clearNodes().unsetAllMarks().run();
     }
   },
   bold: {
-    label: (0, import_i18n52.__)("Bold", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(import_icons36.BoldIcon, { fontSize: "tiny" }),
+    label: (0, import_i18n53.__)("Bold", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(import_icons37.BoldIcon, { fontSize: "tiny" }),
     action: "bold",
     method: (editor) => {
       editor.chain().focus().toggleBold().run();
     }
   },
   italic: {
-    label: (0, import_i18n52.__)("Italic", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(import_icons36.ItalicIcon, { fontSize: "tiny" }),
+    label: (0, import_i18n53.__)("Italic", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(import_icons37.ItalicIcon, { fontSize: "tiny" }),
     action: "italic",
     method: (editor) => {
       editor.chain().focus().toggleItalic().run();
     }
   },
   underline: {
-    label: (0, import_i18n52.__)("Underline", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(import_icons36.UnderlineIcon, { fontSize: "tiny" }),
+    label: (0, import_i18n53.__)("Underline", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(import_icons37.UnderlineIcon, { fontSize: "tiny" }),
     action: "underline",
     method: (editor) => {
       editor.chain().focus().toggleUnderline().run();
     }
   },
   strike: {
-    label: (0, import_i18n52.__)("Strikethrough", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(import_icons36.StrikethroughIcon, { fontSize: "tiny" }),
+    label: (0, import_i18n53.__)("Strikethrough", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(import_icons37.StrikethroughIcon, { fontSize: "tiny" }),
     action: "strike",
     method: (editor) => {
       editor.chain().focus().toggleStrike().run();
     }
   },
   superscript: {
-    label: (0, import_i18n52.__)("Superscript", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(import_icons36.SuperscriptIcon, { fontSize: "tiny" }),
+    label: (0, import_i18n53.__)("Superscript", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(import_icons37.SuperscriptIcon, { fontSize: "tiny" }),
     action: "superscript",
     method: (editor) => {
       editor.chain().focus().toggleSuperscript().run();
     }
   },
   subscript: {
-    label: (0, import_i18n52.__)("Subscript", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(import_icons36.SubscriptIcon, { fontSize: "tiny" }),
+    label: (0, import_i18n53.__)("Subscript", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(import_icons37.SubscriptIcon, { fontSize: "tiny" }),
     action: "subscript",
     method: (editor) => {
       editor.chain().focus().toggleSubscript().run();
     }
   },
   link: {
-    label: (0, import_i18n52.__)("Link", "elementor"),
-    icon: /* @__PURE__ */ React103.createElement(import_icons36.LinkIcon, { fontSize: "tiny" }),
+    label: (0, import_i18n53.__)("Link", "elementor"),
+    icon: /* @__PURE__ */ React104.createElement(import_icons37.LinkIcon, { fontSize: "tiny" }),
     action: "link",
     method: null
   }
@@ -6911,8 +6973,8 @@ var { clear: clearButton, ...formatButtons } = toolbarButtons;
 var possibleFormats = Object.keys(formatButtons);
 
 // src/components/size/unstable-size-field.tsx
-var React106 = __toESM(require("react"));
-var import_ui91 = require("@elementor/ui");
+var React107 = __toESM(require("react"));
+var import_ui92 = require("@elementor/ui");
 
 // src/hooks/use-size-value.ts
 var useSizeValue = (externalValue, onChange, defaultValue) => {
@@ -6952,26 +7014,26 @@ var differsFromExternal = (newState, externalState) => {
 };
 
 // src/components/size/unit-select.tsx
-var React104 = __toESM(require("react"));
-var import_react58 = require("react");
-var import_editor_ui13 = require("@elementor/editor-ui");
-var import_ui90 = require("@elementor/ui");
+var React105 = __toESM(require("react"));
+var import_react59 = require("react");
+var import_editor_ui14 = require("@elementor/editor-ui");
+var import_ui91 = require("@elementor/ui");
 var menuItemContentStyles = {
   display: "flex",
   flexDirection: "column",
   justifyContent: "center"
 };
 var UnitSelect = ({ value, showPrimaryColor, onClick, options }) => {
-  const popupState = (0, import_ui90.usePopupState)({
+  const popupState = (0, import_ui91.usePopupState)({
     variant: "popover",
-    popupId: (0, import_react58.useId)()
+    popupId: (0, import_react59.useId)()
   });
   const handleMenuItemClick = (index) => {
     onClick(options[index]);
     popupState.close();
   };
-  return /* @__PURE__ */ React104.createElement(React104.Fragment, null, /* @__PURE__ */ React104.createElement(StyledButton2, { isPrimaryColor: showPrimaryColor, size: "small", ...(0, import_ui90.bindTrigger)(popupState) }, value), /* @__PURE__ */ React104.createElement(import_ui90.Menu, { MenuListProps: { dense: true }, ...(0, import_ui90.bindMenu)(popupState) }, options.map((option, index) => /* @__PURE__ */ React104.createElement(
-    import_editor_ui13.MenuListItem,
+  return /* @__PURE__ */ React105.createElement(React105.Fragment, null, /* @__PURE__ */ React105.createElement(StyledButton2, { isPrimaryColor: showPrimaryColor, size: "small", ...(0, import_ui91.bindTrigger)(popupState) }, value), /* @__PURE__ */ React105.createElement(import_ui91.Menu, { MenuListProps: { dense: true }, ...(0, import_ui91.bindMenu)(popupState) }, options.map((option, index) => /* @__PURE__ */ React105.createElement(
+    import_editor_ui14.MenuListItem,
     {
       key: option,
       onClick: () => handleMenuItemClick(index),
@@ -6989,7 +7051,7 @@ var UnitSelect = ({ value, showPrimaryColor, onClick, options }) => {
     option.toUpperCase()
   ))));
 };
-var StyledButton2 = (0, import_ui90.styled)(import_ui90.Button, {
+var StyledButton2 = (0, import_ui91.styled)(import_ui91.Button, {
   shouldForwardProp: (prop) => prop !== "isPrimaryColor"
 })(({ isPrimaryColor, theme }) => ({
   color: isPrimaryColor ? theme.palette.text.primary : theme.palette.text.tertiary,
@@ -6999,11 +7061,11 @@ var StyledButton2 = (0, import_ui90.styled)(import_ui90.Button, {
 }));
 
 // src/components/size/unstable-size-input.tsx
-var React105 = __toESM(require("react"));
-var import_react59 = require("react");
-var UnstableSizeInput = (0, import_react59.forwardRef)(
+var React106 = __toESM(require("react"));
+var import_react60 = require("react");
+var UnstableSizeInput = (0, import_react60.forwardRef)(
   ({ type, value, onChange, onKeyDown, onKeyUp, InputProps, onBlur, focused, disabled }, ref) => {
-    return /* @__PURE__ */ React105.createElement(
+    return /* @__PURE__ */ React106.createElement(
       NumberInput,
       {
         ref,
@@ -7047,7 +7109,7 @@ var UnstableSizeField = ({
   const shouldHighlightUnit = () => {
     return hasValue(size);
   };
-  return /* @__PURE__ */ React106.createElement(
+  return /* @__PURE__ */ React107.createElement(
     UnstableSizeInput,
     {
       type: "number",
@@ -7056,7 +7118,7 @@ var UnstableSizeField = ({
       onChange: (event) => setSize(event.target.value),
       InputProps: {
         ...InputProps,
-        endAdornment: /* @__PURE__ */ React106.createElement(import_ui91.InputAdornment, { position: "end" }, /* @__PURE__ */ React106.createElement(
+        endAdornment: /* @__PURE__ */ React107.createElement(import_ui92.InputAdornment, { position: "end" }, /* @__PURE__ */ React107.createElement(
           UnitSelect,
           {
             options: units2,
@@ -7074,13 +7136,13 @@ var hasValue = (value) => {
 };
 
 // src/hooks/use-font-families.ts
-var import_react60 = require("react");
+var import_react61 = require("react");
 var import_editor_v1_adapters = require("@elementor/editor-v1-adapters");
-var import_i18n53 = require("@wordpress/i18n");
+var import_i18n54 = require("@wordpress/i18n");
 var supportedCategories = {
-  system: (0, import_i18n53.__)("System", "elementor"),
-  custom: (0, import_i18n53.__)("Custom Fonts", "elementor"),
-  googlefonts: (0, import_i18n53.__)("Google Fonts", "elementor")
+  system: (0, import_i18n54.__)("System", "elementor"),
+  custom: (0, import_i18n54.__)("Custom Fonts", "elementor"),
+  googlefonts: (0, import_i18n54.__)("Google Fonts", "elementor")
 };
 var getFontFamilies = () => {
   const { controls } = (0, import_editor_v1_adapters.getElementorConfig)();
@@ -7092,7 +7154,7 @@ var getFontFamilies = () => {
 };
 var useFontFamilies = () => {
   const fontFamilies = getFontFamilies();
-  return (0, import_react60.useMemo)(() => {
+  return (0, import_react61.useMemo)(() => {
     const categoriesOrder = ["system", "custom", "googlefonts"];
     return Object.entries(fontFamilies || {}).reduce((acc, [font, category]) => {
       if (!supportedCategories[category]) {
@@ -7124,6 +7186,7 @@ var useFontFamilies = () => {
   ControlReplacementsProvider,
   ControlToggleButtonGroup,
   DateTimeControl,
+  DisplayConditionsControl,
   EqualUnequalSizesControl,
   FilterRepeaterControl,
   FontFamilyControl,