@elementor/editor-editing-panel 3.35.0-394 → 3.35.0-396

package/dist/index.js

@@ -2040,7 +2040,16 @@ function Section({ title, children, defaultExpanded = false, titleEnd, unmountOn
       }
     ), getCollapsibleValue(titleEnd, isOpen)),
     action,
-    /* @__PURE__ */ React19.createElement(import_editor_ui5.CollapseIcon, { open: isOpen, color: "secondary", fontSize: "tiny", disabled: isDisabled })
+    /* @__PURE__ */ React19.createElement(
+      import_editor_ui5.CollapseIcon,
+      {
+        open: isOpen,
+        color: "secondary",
+        fontSize: "tiny",
+        disabled: isDisabled,
+        sx: { ml: 1 }
+      }
+    )
   ), /* @__PURE__ */ React19.createElement(
     import_ui14.Collapse,
     {
@@ -4937,8 +4946,6 @@ var EditingPanelHooks = () => {
 var React86 = __toESM(require("react"));
 var import_react38 = require("react");
 var import_editor_ui8 = require("@elementor/editor-ui");
-var import_icons22 = require("@elementor/icons");
-var import_ui40 = require("@elementor/ui");
 var import_i18n58 = require("@wordpress/i18n");
 function getCustomCssPromotion() {
   const extendedWindow = window;
@@ -4963,22 +4970,7 @@ var CustomCssSection = () => {
             open: showInfoTip,
             setOpen: setShowInfoTip
           },
-          /* @__PURE__ */ React86.createElement(
-            import_ui40.Chip,
-            {
-              size: "tiny",
-              color: "promotion",
-              variant: "standard",
-              icon: /* @__PURE__ */ React86.createElement(import_icons22.CrownFilledIcon, null),
-              sx: {
-                mr: 1,
-                "& .MuiChip-label": {
-                  display: "none"
-                }
-              },
-              onClick: () => setShowInfoTip(true)
-            }
-          )
+          /* @__PURE__ */ React86.createElement(import_editor_ui8.PromotionChip, { onClick: () => setShowInfoTip(true) })
         )
       }
     }
@@ -5001,8 +4993,8 @@ var React87 = __toESM(require("react"));
 var import_editor_controls53 = require("@elementor/editor-controls");
 var import_editor_elements17 = require("@elementor/editor-elements");
 var import_editor_props16 = require("@elementor/editor-props");
-var import_icons23 = require("@elementor/icons");
-var import_ui41 = require("@elementor/ui");
+var import_icons22 = require("@elementor/icons");
+var import_ui40 = require("@elementor/ui");
 var import_i18n60 = require("@wordpress/i18n");
 
 // src/controls-registry/element-controls/get-element-by-type.ts
@@ -5281,7 +5273,7 @@ var ItemLabel = ({ value, index }) => {
   const id = value.id ?? "";
   const editorSettings = (0, import_editor_elements17.useElementEditorSettings)(id);
   const elementTitle = editorSettings?.title;
-  return /* @__PURE__ */ React87.createElement(import_ui41.Stack, { sx: { minHeight: 20 }, direction: "row", alignItems: "center", gap: 1.5 }, /* @__PURE__ */ React87.createElement("span", null, elementTitle), /* @__PURE__ */ React87.createElement(ItemDefaultTab, { index }));
+  return /* @__PURE__ */ React87.createElement(import_ui40.Stack, { sx: { minHeight: 20 }, direction: "row", alignItems: "center", gap: 1.5 }, /* @__PURE__ */ React87.createElement("span", null, elementTitle), /* @__PURE__ */ React87.createElement(ItemDefaultTab, { index }));
 };
 var ItemDefaultTab = ({ index }) => {
   const { value: defaultItem } = (0, import_editor_controls53.useBoundProp)(import_editor_props16.numberPropTypeUtil);
@@ -5289,19 +5281,19 @@ var ItemDefaultTab = ({ index }) => {
   if (!isDefault) {
     return null;
   }
-  return /* @__PURE__ */ React87.createElement(import_ui41.Chip, { size: "tiny", shape: "rounded", label: (0, import_i18n60.__)("Default", "elementor") });
+  return /* @__PURE__ */ React87.createElement(import_ui40.Chip, { size: "tiny", shape: "rounded", label: (0, import_i18n60.__)("Default", "elementor") });
 };
 var ItemContent = ({ value, index }) => {
   if (!value.id) {
     return null;
   }
-  return /* @__PURE__ */ React87.createElement(import_ui41.Stack, { p: 2, gap: 1.5 }, /* @__PURE__ */ React87.createElement(TabLabelControl, { elementId: value.id }), /* @__PURE__ */ React87.createElement(SettingsField, { bind: "default-active-tab", propDisplayName: (0, import_i18n60.__)("Tabs", "elementor") }, /* @__PURE__ */ React87.createElement(DefaultTabControl, { tabIndex: index })));
+  return /* @__PURE__ */ React87.createElement(import_ui40.Stack, { p: 2, gap: 1.5 }, /* @__PURE__ */ React87.createElement(TabLabelControl, { elementId: value.id }), /* @__PURE__ */ React87.createElement(SettingsField, { bind: "default-active-tab", propDisplayName: (0, import_i18n60.__)("Tabs", "elementor") }, /* @__PURE__ */ React87.createElement(DefaultTabControl, { tabIndex: index })));
 };
 var DefaultTabControl = ({ tabIndex }) => {
   const { value, setValue } = (0, import_editor_controls53.useBoundProp)(import_editor_props16.numberPropTypeUtil);
   const isDefault = value === tabIndex;
-  return /* @__PURE__ */ React87.createElement(import_ui41.Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", gap: 2 }, /* @__PURE__ */ React87.createElement(import_editor_controls53.ControlFormLabel, null, (0, import_i18n60.__)("Set as default tab", "elementor")), /* @__PURE__ */ React87.createElement(ConditionalTooltip, { showTooltip: isDefault, placement: "right" }, /* @__PURE__ */ React87.createElement(
-    import_ui41.Switch,
+  return /* @__PURE__ */ React87.createElement(import_ui40.Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", gap: 2 }, /* @__PURE__ */ React87.createElement(import_editor_controls53.ControlFormLabel, null, (0, import_i18n60.__)("Set as default tab", "elementor")), /* @__PURE__ */ React87.createElement(ConditionalTooltip, { showTooltip: isDefault, placement: "right" }, /* @__PURE__ */ React87.createElement(
+    import_ui40.Switch,
     {
       size: "small",
       checked: isDefault,
@@ -5318,8 +5310,8 @@ var DefaultTabControl = ({ tabIndex }) => {
 var TabLabelControl = ({ elementId }) => {
   const editorSettings = (0, import_editor_elements17.useElementEditorSettings)(elementId);
   const label = editorSettings?.title ?? "";
-  return /* @__PURE__ */ React87.createElement(import_ui41.Stack, { gap: 1 }, /* @__PURE__ */ React87.createElement(import_editor_controls53.ControlFormLabel, null, (0, import_i18n60.__)("Tab name", "elementor")), /* @__PURE__ */ React87.createElement(
-    import_ui41.TextField,
+  return /* @__PURE__ */ React87.createElement(import_ui40.Stack, { gap: 1 }, /* @__PURE__ */ React87.createElement(import_editor_controls53.ControlFormLabel, null, (0, import_i18n60.__)("Tab name", "elementor")), /* @__PURE__ */ React87.createElement(
+    import_ui40.TextField,
     {
       size: "tiny",
       value: label,
@@ -5340,18 +5332,18 @@ var ConditionalTooltip = ({
     return children;
   }
   return /* @__PURE__ */ React87.createElement(
-    import_ui41.Infotip,
+    import_ui40.Infotip,
     {
       arrow: false,
       content: /* @__PURE__ */ React87.createElement(
-        import_ui41.Alert,
+        import_ui40.Alert,
         {
           color: "secondary",
-          icon: /* @__PURE__ */ React87.createElement(import_icons23.InfoCircleFilledIcon, { fontSize: "tiny" }),
+          icon: /* @__PURE__ */ React87.createElement(import_icons22.InfoCircleFilledIcon, { fontSize: "tiny" }),
           size: "small",
           sx: { width: 288 }
         },
-        /* @__PURE__ */ React87.createElement(import_ui41.Typography, { variant: "body2" }, (0, import_i18n60.__)("To change the default tab, simply set another tab as default.", "elementor"))
+        /* @__PURE__ */ React87.createElement(import_ui40.Typography, { variant: "body2" }, (0, import_i18n60.__)("To change the default tab, simply set another tab as default.", "elementor"))
       )
     },
     /* @__PURE__ */ React87.createElement("span", null, children)
@@ -5378,7 +5370,7 @@ var import_editor_controls60 = require("@elementor/editor-controls");
 var React88 = __toESM(require("react"));
 var import_editor_controls55 = require("@elementor/editor-controls");
 var import_editor_props18 = require("@elementor/editor-props");
-var import_icons24 = require("@elementor/icons");
+var import_icons23 = require("@elementor/icons");
 
 // src/dynamics/hooks/use-dynamic-tag.ts
 var import_react40 = require("react");
@@ -5471,7 +5463,7 @@ var useDynamicTag = (tagName) => {
 };
 
 // src/dynamics/components/background-control-dynamic-tag.tsx
-var BackgroundControlDynamicTagIcon = () => /* @__PURE__ */ React88.createElement(import_icons24.DatabaseIcon, { fontSize: "tiny" });
+var BackgroundControlDynamicTagIcon = () => /* @__PURE__ */ React88.createElement(import_icons23.DatabaseIcon, { fontSize: "tiny" });
 var BackgroundControlDynamicTagLabel = ({ value }) => {
   const context = (0, import_editor_controls55.useBoundProp)(import_editor_props18.backgroundImageOverlayPropTypeUtil);
   return /* @__PURE__ */ React88.createElement(import_editor_controls55.PropProvider, { ...context, value: value.value }, /* @__PURE__ */ React88.createElement(import_editor_controls55.PropKeyProvider, { bind: "image" }, /* @__PURE__ */ React88.createElement(Wrapper2, { rawValue: value.value })));
@@ -5491,8 +5483,8 @@ var Content = ({ rawValue }) => {
 var React92 = __toESM(require("react"));
 var import_editor_controls58 = require("@elementor/editor-controls");
 var import_editor_ui10 = require("@elementor/editor-ui");
-var import_icons26 = require("@elementor/icons");
-var import_ui43 = require("@elementor/ui");
+var import_icons25 = require("@elementor/icons");
+var import_ui42 = require("@elementor/ui");
 var import_i18n62 = require("@wordpress/i18n");
 
 // src/hooks/use-persist-dynamic-value.ts
@@ -5593,14 +5585,14 @@ var import_react41 = require("react");
 var React91 = __toESM(require("react"));
 var import_editor_controls57 = require("@elementor/editor-controls");
 var import_editor_ui9 = require("@elementor/editor-ui");
-var import_icons25 = require("@elementor/icons");
-var import_ui42 = require("@elementor/ui");
+var import_icons24 = require("@elementor/icons");
+var import_ui41 = require("@elementor/ui");
 var import_i18n61 = require("@wordpress/i18n");
 var SIZE4 = "tiny";
 var DynamicSelection = ({ close: closePopover }) => {
   const [searchValue, setSearchValue] = (0, import_react41.useState)("");
   const { groups: dynamicGroups } = getAtomicDynamicTags() || {};
-  const theme = (0, import_ui42.useTheme)();
+  const theme = (0, import_ui41.useTheme)();
   const { value: anyValue } = (0, import_editor_controls57.useBoundProp)();
   const { bind, value: dynamicValue, setValue } = (0, import_editor_controls57.useBoundProp)(dynamicPropTypeUtil);
   const [, updatePropValueHistory] = usePersistDynamicValue(bind);
@@ -5635,7 +5627,7 @@ var DynamicSelection = ({ close: closePopover }) => {
     {
       title: (0, import_i18n61.__)("Dynamic tags", "elementor"),
       onClose: closePopover,
-      icon: /* @__PURE__ */ React91.createElement(import_icons25.DatabaseIcon, { fontSize: SIZE4 })
+      icon: /* @__PURE__ */ React91.createElement(import_icons24.DatabaseIcon, { fontSize: SIZE4 })
     }
   ), hasNoDynamicTags ? /* @__PURE__ */ React91.createElement(NoDynamicTags, null) : /* @__PURE__ */ React91.createElement(import_react41.Fragment, null, /* @__PURE__ */ React91.createElement(
     import_editor_ui9.SearchField,
@@ -5644,7 +5636,7 @@ var DynamicSelection = ({ close: closePopover }) => {
       onSearch: handleSearch,
       placeholder: (0, import_i18n61.__)("Search dynamic tags\u2026", "elementor")
     }
-  ), /* @__PURE__ */ React91.createElement(import_ui42.Divider, null), /* @__PURE__ */ React91.createElement(
+  ), /* @__PURE__ */ React91.createElement(import_ui41.Divider, null), /* @__PURE__ */ React91.createElement(
     import_editor_ui9.PopoverMenuList,
     {
       items: virtualizedItems,
@@ -5657,7 +5649,7 @@ var DynamicSelection = ({ close: closePopover }) => {
   )));
 };
 var NoResults = ({ searchValue, onClear }) => /* @__PURE__ */ React91.createElement(
-  import_ui42.Stack,
+  import_ui41.Stack,
   {
     gap: 1,
     alignItems: "center",
@@ -5667,12 +5659,12 @@ var NoResults = ({ searchValue, onClear }) => /* @__PURE__ */ React91.createElem
     color: "text.secondary",
     sx: { pb: 3.5 }
   },
-  /* @__PURE__ */ React91.createElement(import_icons25.DatabaseIcon, { fontSize: "large" }),
-  /* @__PURE__ */ React91.createElement(import_ui42.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n61.__)("Sorry, nothing matched", "elementor"), /* @__PURE__ */ React91.createElement("br", null), "\u201C", searchValue, "\u201D."),
-  /* @__PURE__ */ React91.createElement(import_ui42.Typography, { align: "center", variant: "caption", sx: { display: "flex", flexDirection: "column" } }, (0, import_i18n61.__)("Try something else.", "elementor"), /* @__PURE__ */ React91.createElement(import_ui42.Link, { color: "text.secondary", variant: "caption", component: "button", onClick: onClear }, (0, import_i18n61.__)("Clear & try again", "elementor")))
+  /* @__PURE__ */ React91.createElement(import_icons24.DatabaseIcon, { fontSize: "large" }),
+  /* @__PURE__ */ React91.createElement(import_ui41.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n61.__)("Sorry, nothing matched", "elementor"), /* @__PURE__ */ React91.createElement("br", null), "\u201C", searchValue, "\u201D."),
+  /* @__PURE__ */ React91.createElement(import_ui41.Typography, { align: "center", variant: "caption", sx: { display: "flex", flexDirection: "column" } }, (0, import_i18n61.__)("Try something else.", "elementor"), /* @__PURE__ */ React91.createElement(import_ui41.Link, { color: "text.secondary", variant: "caption", component: "button", onClick: onClear }, (0, import_i18n61.__)("Clear & try again", "elementor")))
 );
-var NoDynamicTags = () => /* @__PURE__ */ React91.createElement(React91.Fragment, null, /* @__PURE__ */ React91.createElement(import_ui42.Divider, null), /* @__PURE__ */ React91.createElement(
-  import_ui42.Stack,
+var NoDynamicTags = () => /* @__PURE__ */ React91.createElement(React91.Fragment, null, /* @__PURE__ */ React91.createElement(import_ui41.Divider, null), /* @__PURE__ */ React91.createElement(
+  import_ui41.Stack,
   {
     gap: 1,
     alignItems: "center",
@@ -5682,9 +5674,9 @@ var NoDynamicTags = () => /* @__PURE__ */ React91.createElement(React91.Fragment
     color: "text.secondary",
     sx: { pb: 3.5 }
   },
-  /* @__PURE__ */ React91.createElement(import_icons25.DatabaseIcon, { fontSize: "large" }),
-  /* @__PURE__ */ React91.createElement(import_ui42.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n61.__)("Streamline your workflow with dynamic tags", "elementor")),
-  /* @__PURE__ */ React91.createElement(import_ui42.Typography, { align: "center", variant: "caption" }, (0, import_i18n61.__)("You'll need Elementor Pro to use this feature.", "elementor"))
+  /* @__PURE__ */ React91.createElement(import_icons24.DatabaseIcon, { fontSize: "large" }),
+  /* @__PURE__ */ React91.createElement(import_ui41.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n61.__)("Streamline your workflow with dynamic tags", "elementor")),
+  /* @__PURE__ */ React91.createElement(import_ui41.Typography, { align: "center", variant: "caption" }, (0, import_i18n61.__)("You'll need Elementor Pro to use this feature.", "elementor"))
 ));
 var useFilteredOptions = (searchValue) => {
   const dynamicTags = usePropDynamicTags();
@@ -5709,7 +5701,7 @@ var DynamicSelectionControl = () => {
   const { setValue: setAnyValue } = (0, import_editor_controls58.useBoundProp)();
   const { bind, value } = (0, import_editor_controls58.useBoundProp)(dynamicPropTypeUtil);
   const [propValueFromHistory] = usePersistDynamicValue(bind);
-  const selectionPopoverState = (0, import_ui43.usePopupState)({ variant: "popover" });
+  const selectionPopoverState = (0, import_ui42.usePopupState)({ variant: "popover" });
   const { name: tagName = "" } = value;
   const dynamicTag = useDynamicTag(tagName);
   const removeDynamicTag = () => {
@@ -5718,26 +5710,26 @@ var DynamicSelectionControl = () => {
   if (!dynamicTag) {
     throw new Error(`Dynamic tag ${tagName} not found`);
   }
-  return /* @__PURE__ */ React92.createElement(import_ui43.Box, null, /* @__PURE__ */ React92.createElement(
-    import_ui43.UnstableTag,
+  return /* @__PURE__ */ React92.createElement(import_ui42.Box, null, /* @__PURE__ */ React92.createElement(
+    import_ui42.UnstableTag,
     {
       fullWidth: true,
       showActionsOnHover: true,
       label: dynamicTag.label,
-      startIcon: /* @__PURE__ */ React92.createElement(import_icons26.DatabaseIcon, { fontSize: SIZE5 }),
-      ...(0, import_ui43.bindTrigger)(selectionPopoverState),
+      startIcon: /* @__PURE__ */ React92.createElement(import_icons25.DatabaseIcon, { fontSize: SIZE5 }),
+      ...(0, import_ui42.bindTrigger)(selectionPopoverState),
       actions: /* @__PURE__ */ React92.createElement(React92.Fragment, null, /* @__PURE__ */ React92.createElement(DynamicSettingsPopover, { dynamicTag }), /* @__PURE__ */ React92.createElement(
-        import_ui43.IconButton,
+        import_ui42.IconButton,
         {
           size: SIZE5,
           onClick: removeDynamicTag,
           "aria-label": (0, import_i18n62.__)("Remove dynamic value", "elementor")
         },
-        /* @__PURE__ */ React92.createElement(import_icons26.XIcon, { fontSize: SIZE5 })
+        /* @__PURE__ */ React92.createElement(import_icons25.XIcon, { fontSize: SIZE5 })
       ))
     }
   ), /* @__PURE__ */ React92.createElement(
-    import_ui43.Popover,
+    import_ui42.Popover,
     {
       disablePortal: true,
       disableScrollLock: true,
@@ -5746,27 +5738,27 @@ var DynamicSelectionControl = () => {
       PaperProps: {
         sx: { my: 1 }
       },
-      ...(0, import_ui43.bindPopover)(selectionPopoverState)
+      ...(0, import_ui42.bindPopover)(selectionPopoverState)
     },
     /* @__PURE__ */ React92.createElement(PopoverBody, { "aria-label": (0, import_i18n62.__)("Dynamic tags", "elementor") }, /* @__PURE__ */ React92.createElement(DynamicSelection, { close: selectionPopoverState.close }))
   ));
 };
 var DynamicSettingsPopover = ({ dynamicTag }) => {
-  const popupState = (0, import_ui43.usePopupState)({ variant: "popover" });
+  const popupState = (0, import_ui42.usePopupState)({ variant: "popover" });
   const hasDynamicSettings = !!dynamicTag.atomic_controls.length;
   if (!hasDynamicSettings) {
     return null;
   }
   return /* @__PURE__ */ React92.createElement(React92.Fragment, null, /* @__PURE__ */ React92.createElement(
-    import_ui43.IconButton,
+    import_ui42.IconButton,
     {
       size: SIZE5,
-      ...(0, import_ui43.bindTrigger)(popupState),
+      ...(0, import_ui42.bindTrigger)(popupState),
       "aria-label": (0, import_i18n62.__)("Dynamic settings", "elementor")
     },
-    /* @__PURE__ */ React92.createElement(import_icons26.SettingsIcon, { fontSize: SIZE5 })
+    /* @__PURE__ */ React92.createElement(import_icons25.SettingsIcon, { fontSize: SIZE5 })
   ), /* @__PURE__ */ React92.createElement(
-    import_ui43.Popover,
+    import_ui42.Popover,
     {
       disablePortal: true,
       disableScrollLock: true,
@@ -5775,39 +5767,39 @@ var DynamicSettingsPopover = ({ dynamicTag }) => {
       PaperProps: {
         sx: { my: 1 }
       },
-      ...(0, import_ui43.bindPopover)(popupState)
+      ...(0, import_ui42.bindPopover)(popupState)
     },
     /* @__PURE__ */ React92.createElement(PopoverBody, { "aria-label": (0, import_i18n62.__)("Dynamic settings", "elementor") }, /* @__PURE__ */ React92.createElement(
       import_editor_ui10.PopoverHeader,
       {
         title: dynamicTag.label,
         onClose: popupState.close,
-        icon: /* @__PURE__ */ React92.createElement(import_icons26.DatabaseIcon, { fontSize: SIZE5 })
+        icon: /* @__PURE__ */ React92.createElement(import_icons25.DatabaseIcon, { fontSize: SIZE5 })
       }
     ), /* @__PURE__ */ React92.createElement(DynamicSettings, { controls: dynamicTag.atomic_controls, tagName: dynamicTag.name }))
   ));
 };
 var DynamicSettings = ({ controls, tagName }) => {
   const tabs = controls.filter(({ type }) => type === "section");
-  const { getTabsProps, getTabProps, getTabPanelProps } = (0, import_ui43.useTabs)(0);
+  const { getTabsProps, getTabProps, getTabPanelProps } = (0, import_ui42.useTabs)(0);
   if (!tabs.length) {
     return null;
   }
   if (tagsWithoutTabs.includes(tagName)) {
     const singleTab = tabs[0];
-    return /* @__PURE__ */ React92.createElement(React92.Fragment, null, /* @__PURE__ */ React92.createElement(import_ui43.Divider, null), /* @__PURE__ */ React92.createElement(ControlsItemsStack, { items: singleTab.value.items }));
+    return /* @__PURE__ */ React92.createElement(React92.Fragment, null, /* @__PURE__ */ React92.createElement(import_ui42.Divider, null), /* @__PURE__ */ React92.createElement(ControlsItemsStack, { items: singleTab.value.items }));
   }
-  return /* @__PURE__ */ React92.createElement(React92.Fragment, null, tabs.length > 1 && /* @__PURE__ */ React92.createElement(import_ui43.Tabs, { size: "small", variant: "fullWidth", ...getTabsProps() }, tabs.map(({ value }, index) => /* @__PURE__ */ React92.createElement(
-    import_ui43.Tab,
+  return /* @__PURE__ */ React92.createElement(React92.Fragment, null, tabs.length > 1 && /* @__PURE__ */ React92.createElement(import_ui42.Tabs, { size: "small", variant: "fullWidth", ...getTabsProps() }, tabs.map(({ value }, index) => /* @__PURE__ */ React92.createElement(
+    import_ui42.Tab,
     {
       key: index,
       label: value.label,
       sx: { px: 1, py: 0.5 },
       ...getTabProps(index)
     }
-  ))), /* @__PURE__ */ React92.createElement(import_ui43.Divider, null), tabs.map(({ value }, index) => {
+  ))), /* @__PURE__ */ React92.createElement(import_ui42.Divider, null), tabs.map(({ value }, index) => {
     return /* @__PURE__ */ React92.createElement(
-      import_ui43.TabPanel,
+      import_ui42.TabPanel,
       {
         key: index,
         sx: { flexGrow: 1, py: 0, overflowY: "auto" },
@@ -5855,10 +5847,10 @@ var Control2 = ({ control }) => {
     display: "grid",
     gridTemplateColumns: isSwitchControl ? "minmax(0, 1fr) max-content" : "1fr 1fr"
   } : {};
-  return /* @__PURE__ */ React92.createElement(DynamicControl, { bind: control.bind }, /* @__PURE__ */ React92.createElement(import_ui43.Grid, { container: true, gap: 0.75, sx: layoutStyleProps }, control.label ? /* @__PURE__ */ React92.createElement(import_ui43.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React92.createElement(import_editor_controls58.ControlFormLabel, null, control.label)) : null, /* @__PURE__ */ React92.createElement(import_ui43.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React92.createElement(Control, { type: control.type, props: controlProps }))));
+  return /* @__PURE__ */ React92.createElement(DynamicControl, { bind: control.bind }, /* @__PURE__ */ React92.createElement(import_ui42.Grid, { container: true, gap: 0.75, sx: layoutStyleProps }, control.label ? /* @__PURE__ */ React92.createElement(import_ui42.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React92.createElement(import_editor_controls58.ControlFormLabel, null, control.label)) : null, /* @__PURE__ */ React92.createElement(import_ui42.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React92.createElement(Control, { type: control.type, props: controlProps }))));
 };
 function ControlsItemsStack({ items: items3 }) {
-  return /* @__PURE__ */ React92.createElement(import_ui43.Stack, { p: 2, gap: 2, sx: { overflowY: "auto" } }, items3.map(
+  return /* @__PURE__ */ React92.createElement(import_ui42.Stack, { p: 2, gap: 2, sx: { overflowY: "auto" } }, items3.map(
     (item) => item.type === "control" ? /* @__PURE__ */ React92.createElement(Control2, { key: item.value.bind, control: item.value }) : null
   ));
 }
@@ -5915,14 +5907,14 @@ function getDynamicValue(name, settings) {
 // src/dynamics/hooks/use-prop-dynamic-action.tsx
 var React93 = __toESM(require("react"));
 var import_editor_controls59 = require("@elementor/editor-controls");
-var import_icons27 = require("@elementor/icons");
+var import_icons26 = require("@elementor/icons");
 var import_i18n63 = require("@wordpress/i18n");
 var usePropDynamicAction = () => {
   const { propType } = (0, import_editor_controls59.useBoundProp)();
   const visible = !!propType && supportsDynamic(propType);
   return {
     visible,
-    icon: import_icons27.DatabaseIcon,
+    icon: import_icons26.DatabaseIcon,
     title: (0, import_i18n63.__)("Dynamic tags", "elementor"),
     content: ({ close }) => /* @__PURE__ */ React93.createElement(DynamicSelection, { close })
   };
@@ -5955,7 +5947,7 @@ var init2 = () => {
 
 // src/reset-style-props.tsx
 var import_editor_controls61 = require("@elementor/editor-controls");
-var import_icons28 = require("@elementor/icons");
+var import_icons27 = require("@elementor/icons");
 var import_i18n64 = require("@wordpress/i18n");
 
 // src/utils/is-equal.ts
@@ -6029,7 +6021,7 @@ function useResetStyleValueProps() {
   return {
     visible,
     title: (0, import_i18n64.__)("Clear", "elementor"),
-    icon: import_icons28.BrushBigIcon,
+    icon: import_icons27.BrushBigIcon,
     onClick: () => resetValue()
   };
 }
@@ -6046,7 +6038,7 @@ var React98 = __toESM(require("react"));
 var import_react43 = require("react");
 var import_editor_canvas6 = require("@elementor/editor-canvas");
 var import_editor_ui11 = require("@elementor/editor-ui");
-var import_ui48 = require("@elementor/ui");
+var import_ui47 = require("@elementor/ui");
 var import_i18n67 = require("@wordpress/i18n");
 
 // src/styles-inheritance/hooks/use-normalized-inheritance-chain-items.tsx
@@ -6128,18 +6120,18 @@ var stylesInheritanceTransformersRegistry = (0, import_editor_canvas5.createTran
 // src/styles-inheritance/components/infotip/breakpoint-icon.tsx
 var React94 = __toESM(require("react"));
 var import_editor_responsive4 = require("@elementor/editor-responsive");
-var import_icons29 = require("@elementor/icons");
-var import_ui44 = require("@elementor/ui");
+var import_icons28 = require("@elementor/icons");
+var import_ui43 = require("@elementor/ui");
 var SIZE6 = "tiny";
 var DEFAULT_BREAKPOINT3 = "desktop";
 var breakpointIconMap = {
-  widescreen: import_icons29.WidescreenIcon,
-  desktop: import_icons29.DesktopIcon,
-  laptop: import_icons29.LaptopIcon,
-  tablet_extra: import_icons29.TabletLandscapeIcon,
-  tablet: import_icons29.TabletPortraitIcon,
-  mobile_extra: import_icons29.MobileLandscapeIcon,
-  mobile: import_icons29.MobilePortraitIcon
+  widescreen: import_icons28.WidescreenIcon,
+  desktop: import_icons28.DesktopIcon,
+  laptop: import_icons28.LaptopIcon,
+  tablet_extra: import_icons28.TabletLandscapeIcon,
+  tablet: import_icons28.TabletPortraitIcon,
+  mobile_extra: import_icons28.MobileLandscapeIcon,
+  mobile: import_icons28.MobilePortraitIcon
 };
 var BreakpointIcon = ({ breakpoint }) => {
   const breakpoints = (0, import_editor_responsive4.useBreakpoints)();
@@ -6149,21 +6141,21 @@ var BreakpointIcon = ({ breakpoint }) => {
     return null;
   }
   const breakpointLabel = breakpoints.find((breakpointItem) => breakpointItem.id === currentBreakpoint)?.label;
-  return /* @__PURE__ */ React94.createElement(import_ui44.Tooltip, { title: breakpointLabel, placement: "top" }, /* @__PURE__ */ React94.createElement(IconComponent, { fontSize: SIZE6, sx: { mt: "2px" } }));
+  return /* @__PURE__ */ React94.createElement(import_ui43.Tooltip, { title: breakpointLabel, placement: "top" }, /* @__PURE__ */ React94.createElement(IconComponent, { fontSize: SIZE6, sx: { mt: "2px" } }));
 };
 
 // src/styles-inheritance/components/infotip/label-chip.tsx
 var React95 = __toESM(require("react"));
 var import_editor_styles_repository15 = require("@elementor/editor-styles-repository");
-var import_icons30 = require("@elementor/icons");
-var import_ui45 = require("@elementor/ui");
+var import_icons29 = require("@elementor/icons");
+var import_ui44 = require("@elementor/ui");
 var import_i18n66 = require("@wordpress/i18n");
 var SIZE7 = "tiny";
 var LabelChip = ({ displayLabel, provider }) => {
   const isBaseStyle = provider === import_editor_styles_repository15.ELEMENTS_BASE_STYLES_PROVIDER_KEY;
-  const chipIcon = isBaseStyle ? /* @__PURE__ */ React95.createElement(import_ui45.Tooltip, { title: (0, import_i18n66.__)("Inherited from base styles", "elementor"), placement: "top" }, /* @__PURE__ */ React95.createElement(import_icons30.InfoCircleIcon, { fontSize: SIZE7 })) : void 0;
+  const chipIcon = isBaseStyle ? /* @__PURE__ */ React95.createElement(import_ui44.Tooltip, { title: (0, import_i18n66.__)("Inherited from base styles", "elementor"), placement: "top" }, /* @__PURE__ */ React95.createElement(import_icons29.InfoCircleIcon, { fontSize: SIZE7 })) : void 0;
   return /* @__PURE__ */ React95.createElement(
-    import_ui45.Chip,
+    import_ui44.Chip,
     {
       label: displayLabel,
       size: SIZE7,
@@ -6189,10 +6181,10 @@ var LabelChip = ({ displayLabel, provider }) => {
 
 // src/styles-inheritance/components/infotip/value-component.tsx
 var React96 = __toESM(require("react"));
-var import_ui46 = require("@elementor/ui");
+var import_ui45 = require("@elementor/ui");
 var ValueComponent = ({ index, value }) => {
   return /* @__PURE__ */ React96.createElement(
-    import_ui46.Typography,
+    import_ui45.Typography,
     {
       variant: "caption",
       color: "text.tertiary",
@@ -6213,8 +6205,8 @@ var ValueComponent = ({ index, value }) => {
 
 // src/styles-inheritance/components/infotip/action-icons.tsx
 var React97 = __toESM(require("react"));
-var import_ui47 = require("@elementor/ui");
-var ActionIcons = () => /* @__PURE__ */ React97.createElement(import_ui47.Box, { display: "flex", gap: 0.5, alignItems: "center" });
+var import_ui46 = require("@elementor/ui");
+var ActionIcons = () => /* @__PURE__ */ React97.createElement(import_ui46.Box, { display: "flex", gap: 0.5, alignItems: "center" });
 
 // src/styles-inheritance/components/styles-inheritance-infotip.tsx
 var SECTION_PADDING_INLINE = 32;
@@ -6248,8 +6240,8 @@ var StylesInheritanceInfotip = ({
     });
   }, [key, propType]);
   const items3 = useNormalizedInheritanceChainItems(inheritanceChain, key, resolve);
-  const infotipContent = /* @__PURE__ */ React98.createElement(import_ui48.ClickAwayListener, { onClickAway: closeInfotip }, /* @__PURE__ */ React98.createElement(
-    import_ui48.Card,
+  const infotipContent = /* @__PURE__ */ React98.createElement(import_ui47.ClickAwayListener, { onClickAway: closeInfotip }, /* @__PURE__ */ React98.createElement(
+    import_ui47.Card,
     {
       elevation: 0,
       sx: {
@@ -6262,7 +6254,7 @@ var StylesInheritanceInfotip = ({
       }
     },
     /* @__PURE__ */ React98.createElement(
-      import_ui48.Box,
+      import_ui47.Box,
       {
         sx: {
           position: "sticky",
@@ -6274,7 +6266,7 @@ var StylesInheritanceInfotip = ({
       /* @__PURE__ */ React98.createElement(import_editor_ui11.PopoverHeader, { title: (0, import_i18n67.__)("Style origin", "elementor"), onClose: closeInfotip })
     ),
     /* @__PURE__ */ React98.createElement(
-      import_ui48.CardContent,
+      import_ui47.CardContent,
       {
         sx: {
           display: "flex",
@@ -6287,9 +6279,9 @@ var StylesInheritanceInfotip = ({
           }
         }
       },
-      /* @__PURE__ */ React98.createElement(import_ui48.Stack, { gap: 1.5, sx: { pl: 3, pr: 1, pb: 2 }, role: "list" }, items3.map((item, index) => {
+      /* @__PURE__ */ React98.createElement(import_ui47.Stack, { gap: 1.5, sx: { pl: 3, pr: 1, pb: 2 }, role: "list" }, items3.map((item, index) => {
         return /* @__PURE__ */ React98.createElement(
-          import_ui48.Box,
+          import_ui47.Box,
           {
             key: item.id,
             display: "flex",
@@ -6301,7 +6293,7 @@ var StylesInheritanceInfotip = ({
             )
           },
           /* @__PURE__ */ React98.createElement(
-            import_ui48.Box,
+            import_ui47.Box,
             {
               display: "flex",
               gap: 0.5,
@@ -6317,7 +6309,7 @@ var StylesInheritanceInfotip = ({
     )
   ));
   if (isDisabled) {
-    return /* @__PURE__ */ React98.createElement(import_ui48.Box, { sx: { display: "inline-flex" } }, children);
+    return /* @__PURE__ */ React98.createElement(import_ui47.Box, { sx: { display: "inline-flex" } }, children);
   }
   return /* @__PURE__ */ React98.createElement(
     TooltipOrInfotip,
@@ -6327,7 +6319,7 @@ var StylesInheritanceInfotip = ({
       infotipContent,
       isDisabled
     },
-    /* @__PURE__ */ React98.createElement(import_ui48.IconButton, { onClick: toggleInfotip, "aria-label": label, sx: { my: "-1px" }, disabled: isDisabled }, children)
+    /* @__PURE__ */ React98.createElement(import_ui47.IconButton, { onClick: toggleInfotip, "aria-label": label, sx: { my: "-1px" }, disabled: isDisabled }, children)
   );
 };
 function TooltipOrInfotip({
@@ -6341,11 +6333,11 @@ function TooltipOrInfotip({
   const isSiteRtl = direction.isSiteRtl;
   const forceInfotipAlignLeft = isSiteRtl ? 9999999 : -9999999;
   if (isDisabled) {
-    return /* @__PURE__ */ React98.createElement(import_ui48.Box, { sx: { display: "inline-flex" } }, children);
+    return /* @__PURE__ */ React98.createElement(import_ui47.Box, { sx: { display: "inline-flex" } }, children);
   }
   if (showInfotip) {
     return /* @__PURE__ */ React98.createElement(React98.Fragment, null, /* @__PURE__ */ React98.createElement(
-      import_ui48.Backdrop,
+      import_ui47.Backdrop,
       {
         open: showInfotip,
         onClick: onClose,
@@ -6355,7 +6347,7 @@ function TooltipOrInfotip({
         }
       }
     ), /* @__PURE__ */ React98.createElement(
-      import_ui48.Infotip,
+      import_ui47.Infotip,
       {
         placement: "top",
         content: infotipContent,
@@ -6381,7 +6373,7 @@ function TooltipOrInfotip({
       children
     ));
   }
-  return /* @__PURE__ */ React98.createElement(import_ui48.Tooltip, { title: (0, import_i18n67.__)("Style origin", "elementor"), placement: "top" }, children);
+  return /* @__PURE__ */ React98.createElement(import_ui47.Tooltip, { title: (0, import_i18n67.__)("Style origin", "elementor"), placement: "top" }, children);
 }
 
 // src/styles-inheritance/components/styles-inheritance-indicator.tsx
@@ -6452,23 +6444,23 @@ var excludePropTypeTransformers = /* @__PURE__ */ new Set([
 // src/styles-inheritance/transformers/array-transformer.tsx
 var React100 = __toESM(require("react"));
 var import_editor_canvas7 = require("@elementor/editor-canvas");
-var import_ui49 = require("@elementor/ui");
+var import_ui48 = require("@elementor/ui");
 var arrayTransformer = (0, import_editor_canvas7.createTransformer)((values) => {
   if (!values || values.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ React100.createElement(import_ui49.Stack, { direction: "column" }, values.map((item, index) => /* @__PURE__ */ React100.createElement(import_ui49.Stack, { key: index }, item)));
+  return /* @__PURE__ */ React100.createElement(import_ui48.Stack, { direction: "column" }, values.map((item, index) => /* @__PURE__ */ React100.createElement(import_ui48.Stack, { key: index }, item)));
 });
 
 // src/styles-inheritance/transformers/background-color-overlay-transformer.tsx
 var React101 = __toESM(require("react"));
 var import_editor_canvas8 = require("@elementor/editor-canvas");
-var import_ui50 = require("@elementor/ui");
-var backgroundColorOverlayTransformer = (0, import_editor_canvas8.createTransformer)((value) => /* @__PURE__ */ React101.createElement(import_ui50.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React101.createElement(ItemLabelColor, { value })));
+var import_ui49 = require("@elementor/ui");
+var backgroundColorOverlayTransformer = (0, import_editor_canvas8.createTransformer)((value) => /* @__PURE__ */ React101.createElement(import_ui49.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React101.createElement(ItemLabelColor, { value })));
 var ItemLabelColor = ({ value: { color } }) => {
   return /* @__PURE__ */ React101.createElement("span", null, color);
 };
-var StyledUnstableColorIndicator = (0, import_ui50.styled)(import_ui50.UnstableColorIndicator)(({ theme }) => ({
+var StyledUnstableColorIndicator = (0, import_ui49.styled)(import_ui49.UnstableColorIndicator)(({ theme }) => ({
   width: "1em",
   height: "1em",
   borderRadius: `${theme.shape.borderRadius / 2}px`,
@@ -6479,9 +6471,9 @@ var StyledUnstableColorIndicator = (0, import_ui50.styled)(import_ui50.UnstableC
 // src/styles-inheritance/transformers/background-gradient-overlay-transformer.tsx
 var React102 = __toESM(require("react"));
 var import_editor_canvas9 = require("@elementor/editor-canvas");
-var import_ui51 = require("@elementor/ui");
+var import_ui50 = require("@elementor/ui");
 var import_i18n69 = require("@wordpress/i18n");
-var backgroundGradientOverlayTransformer = (0, import_editor_canvas9.createTransformer)((value) => /* @__PURE__ */ React102.createElement(import_ui51.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React102.createElement(ItemIconGradient, { value }), /* @__PURE__ */ React102.createElement(ItemLabelGradient, { value })));
+var backgroundGradientOverlayTransformer = (0, import_editor_canvas9.createTransformer)((value) => /* @__PURE__ */ React102.createElement(import_ui50.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React102.createElement(ItemIconGradient, { value }), /* @__PURE__ */ React102.createElement(ItemLabelGradient, { value })));
 var ItemIconGradient = ({ value }) => {
   const gradient = getGradientValue(value);
   return /* @__PURE__ */ React102.createElement(StyledUnstableColorIndicator, { size: "inherit", component: "span", value: gradient });
@@ -6504,13 +6496,13 @@ var getGradientValue = (gradient) => {
 var React103 = __toESM(require("react"));
 var import_editor_canvas10 = require("@elementor/editor-canvas");
 var import_editor_ui12 = require("@elementor/editor-ui");
-var import_ui52 = require("@elementor/ui");
+var import_ui51 = require("@elementor/ui");
 var import_wp_media = require("@elementor/wp-media");
-var backgroundImageOverlayTransformer = (0, import_editor_canvas10.createTransformer)((value) => /* @__PURE__ */ React103.createElement(import_ui52.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React103.createElement(ItemIconImage, { value }), /* @__PURE__ */ React103.createElement(ItemLabelImage, { value })));
+var backgroundImageOverlayTransformer = (0, import_editor_canvas10.createTransformer)((value) => /* @__PURE__ */ React103.createElement(import_ui51.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React103.createElement(ItemIconImage, { value }), /* @__PURE__ */ React103.createElement(ItemLabelImage, { value })));
 var ItemIconImage = ({ value }) => {
   const { imageUrl } = useImage(value);
   return /* @__PURE__ */ React103.createElement(
-    import_ui52.CardMedia,
+    import_ui51.CardMedia,
     {
       image: imageUrl,
       sx: (theme) => ({
@@ -6552,7 +6544,7 @@ var getFileExtensionFromFilename = (filename) => {
 // src/styles-inheritance/transformers/box-shadow-transformer.tsx
 var React104 = __toESM(require("react"));
 var import_editor_canvas11 = require("@elementor/editor-canvas");
-var import_ui53 = require("@elementor/ui");
+var import_ui52 = require("@elementor/ui");
 var boxShadowTransformer = (0, import_editor_canvas11.createTransformer)((value) => {
   if (!value) {
     return null;
@@ -6561,20 +6553,20 @@ var boxShadowTransformer = (0, import_editor_canvas11.createTransformer)((value)
   const colorValue = color || "#000000";
   const sizes = [hOffset || "0px", vOffset || "0px", blur || "10px", spread || "0px"].join(" ");
   const positionValue = position || "outset";
-  return /* @__PURE__ */ React104.createElement(import_ui53.Stack, { direction: "column", gap: 0.5, pb: 1 }, /* @__PURE__ */ React104.createElement("span", null, colorValue, " ", positionValue, ", ", sizes));
+  return /* @__PURE__ */ React104.createElement(import_ui52.Stack, { direction: "column", gap: 0.5, pb: 1 }, /* @__PURE__ */ React104.createElement("span", null, colorValue, " ", positionValue, ", ", sizes));
 });
 
 // src/styles-inheritance/transformers/color-transformer.tsx
 var React105 = __toESM(require("react"));
 var import_editor_canvas12 = require("@elementor/editor-canvas");
-var import_ui54 = require("@elementor/ui");
+var import_ui53 = require("@elementor/ui");
 function isValidCSSColor(value) {
   if (!value.trim()) {
     return false;
   }
   return CSS.supports("color", value.trim());
 }
-var StyledColorIndicator = (0, import_ui54.styled)(import_ui54.UnstableColorIndicator)(({ theme }) => ({
+var StyledColorIndicator = (0, import_ui53.styled)(import_ui53.UnstableColorIndicator)(({ theme }) => ({
   width: "1em",
   height: "1em",
   borderRadius: `${theme.shape.borderRadius / 2}px`,
@@ -6585,13 +6577,13 @@ var colorTransformer = (0, import_editor_canvas12.createTransformer)((value) =>
   if (!isValidCSSColor(value)) {
     return value;
   }
-  return /* @__PURE__ */ React105.createElement(import_ui54.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React105.createElement(StyledColorIndicator, { size: "inherit", component: "span", value }), /* @__PURE__ */ React105.createElement("span", null, value));
+  return /* @__PURE__ */ React105.createElement(import_ui53.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React105.createElement(StyledColorIndicator, { size: "inherit", component: "span", value }), /* @__PURE__ */ React105.createElement("span", null, value));
 });
 
 // src/styles-inheritance/transformers/repeater-to-items-transformer.tsx
 var React106 = __toESM(require("react"));
 var import_editor_canvas13 = require("@elementor/editor-canvas");
-var import_ui55 = require("@elementor/ui");
+var import_ui54 = require("@elementor/ui");
 var createRepeaterToItemsTransformer = (originalTransformer, separator = " ") => {
   return (0, import_editor_canvas13.createTransformer)((value, options12) => {
     const stringResult = originalTransformer(value, options12);
@@ -6602,7 +6594,7 @@ var createRepeaterToItemsTransformer = (originalTransformer, separator = " ") =>
     if (parts.length <= 1) {
       return stringResult;
     }
-    return /* @__PURE__ */ React106.createElement(import_ui55.Stack, { direction: "column", gap: 0.5 }, parts.map((part, index) => /* @__PURE__ */ React106.createElement(import_ui55.Stack, { key: index }, part.trim())));
+    return /* @__PURE__ */ React106.createElement(import_ui54.Stack, { direction: "column", gap: 0.5 }, parts.map((part, index) => /* @__PURE__ */ React106.createElement(import_ui54.Stack, { key: index }, part.trim())));
   });
 };