@elementor/editor-variables 4.0.0-499 → 4.0.0-501

package/dist/index.js

@@ -42,7 +42,7 @@ module.exports = __toCommonJS(index_exports);
 
 // src/init.ts
 var import_editor = require("@elementor/editor");
-var import_editor_editing_panel8 = require("@elementor/editor-editing-panel");
+var import_editor_editing_panel4 = require("@elementor/editor-editing-panel");
 var import_editor_panels2 = require("@elementor/editor-panels");
 var import_editor_props7 = require("@elementor/editor-props");
 
@@ -2080,7 +2080,6 @@ var usePopoverContentRef = () => {
 var React15 = __toESM(require("react"));
 var import_react13 = require("react");
 var import_editor_controls4 = require("@elementor/editor-controls");
-var import_editor_editing_panel2 = require("@elementor/editor-editing-panel");
 var import_editor_ui6 = require("@elementor/editor-ui");
 var import_icons6 = require("@elementor/icons");
 var import_ui15 = require("@elementor/ui");
@@ -2201,7 +2200,7 @@ var VariableCreation = ({ onGoBack, onClose }) => {
       handleCreateAndTrack();
     }
   };
-  return /* @__PURE__ */ React15.createElement(import_editor_editing_panel2.PopoverBody, { height: "auto" }, /* @__PURE__ */ React15.createElement(
+  return /* @__PURE__ */ React15.createElement(import_editor_ui6.SectionPopoverBody, { height: "auto" }, /* @__PURE__ */ React15.createElement(
     import_editor_ui6.PopoverHeader,
     {
       icon: /* @__PURE__ */ React15.createElement(React15.Fragment, null, onGoBack && /* @__PURE__ */ React15.createElement(import_ui15.IconButton, { size: SIZE2, "aria-label": (0, import_i18n10.__)("Go Back", "elementor"), onClick: onGoBack }, /* @__PURE__ */ React15.createElement(import_icons6.ArrowLeftIcon, { fontSize: SIZE2 })), /* @__PURE__ */ React15.createElement(VariableIcon, { fontSize: SIZE2 })),
@@ -2267,7 +2266,6 @@ var React17 = __toESM(require("react"));
 var import_react15 = require("react");
 var import_editor_controls5 = require("@elementor/editor-controls");
 var import_editor_current_user2 = require("@elementor/editor-current-user");
-var import_editor_editing_panel3 = require("@elementor/editor-editing-panel");
 var import_editor_ui7 = require("@elementor/editor-ui");
 var import_icons8 = require("@elementor/icons");
 var import_ui17 = require("@elementor/ui");
@@ -2419,7 +2417,7 @@ var VariableEdit = ({ onClose, onGoBack, onSubmit, editId }) => {
       handleUpdate();
     }
   };
-  return /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(import_editor_editing_panel3.PopoverBody, { height: "auto" }, /* @__PURE__ */ React17.createElement(
+  return /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(import_editor_ui7.SectionPopoverBody, { height: "auto" }, /* @__PURE__ */ React17.createElement(
     import_editor_ui7.PopoverHeader,
     {
       title: (0, import_i18n12.__)("Edit variable", "elementor"),
@@ -2498,8 +2496,8 @@ var VariableEdit = ({ onClose, onGoBack, onSubmit, editId }) => {
 // src/components/variables-selection.tsx
 var React19 = __toESM(require("react"));
 var import_react16 = require("react");
-var import_editor_editing_panel4 = require("@elementor/editor-editing-panel");
 var import_editor_ui9 = require("@elementor/editor-ui");
+var import_editor_ui10 = require("@elementor/editor-ui");
 var import_icons10 = require("@elementor/icons");
 var import_ui20 = require("@elementor/ui");
 var import_i18n14 = require("@wordpress/i18n");
@@ -2677,8 +2675,8 @@ var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings, disabled =
   const handleClearSearch = () => {
     setSearchValue("");
   };
-  return /* @__PURE__ */ React19.createElement(import_editor_editing_panel4.PopoverBody, null, /* @__PURE__ */ React19.createElement(
-    import_editor_ui9.PopoverHeader,
+  return /* @__PURE__ */ React19.createElement(import_editor_ui9.SectionPopoverBody, null, /* @__PURE__ */ React19.createElement(
+    import_editor_ui10.PopoverHeader,
     {
       title: (0, import_i18n14.__)("Variables", "elementor"),
       icon: /* @__PURE__ */ React19.createElement(import_icons10.ColorFilterIcon, { fontSize: SIZE5 }),
@@ -2686,14 +2684,14 @@ var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings, disabled =
       actions
     }
   ), hasVariables && /* @__PURE__ */ React19.createElement(
-    import_editor_ui9.SearchField,
+    import_editor_ui10.SearchField,
     {
       value: searchValue,
       onSearch: handleSearch,
       placeholder: (0, import_i18n14.__)("Search", "elementor")
     }
   ), /* @__PURE__ */ React19.createElement(import_ui20.Divider, null), hasVariables && hasSearchResults && /* @__PURE__ */ React19.createElement(
-    import_editor_ui9.PopoverMenuList,
+    import_editor_ui10.PopoverMenuList,
     {
       items,
       onSelect: handleSetVariable,
@@ -2923,8 +2921,7 @@ var import_i18n18 = require("@wordpress/i18n");
 var React23 = __toESM(require("react"));
 var import_react19 = require("react");
 var import_editor_controls7 = require("@elementor/editor-controls");
-var import_editor_editing_panel5 = require("@elementor/editor-editing-panel");
-var import_editor_ui10 = require("@elementor/editor-ui");
+var import_editor_ui11 = require("@elementor/editor-ui");
 var import_ui23 = require("@elementor/ui");
 var import_i18n16 = require("@wordpress/i18n");
 var SIZE7 = "tiny";
@@ -2986,8 +2983,8 @@ var VariableRestore = ({ variableId, onClose, onSubmit }) => {
       handleRestore();
     }
   };
-  return /* @__PURE__ */ React23.createElement(PopoverContentRefContextProvider, null, /* @__PURE__ */ React23.createElement(import_editor_editing_panel5.PopoverBody, { height: "auto" }, /* @__PURE__ */ React23.createElement(
-    import_editor_ui10.PopoverHeader,
+  return /* @__PURE__ */ React23.createElement(PopoverContentRefContextProvider, null, /* @__PURE__ */ React23.createElement(import_editor_ui11.SectionPopoverBody, { height: "auto" }, /* @__PURE__ */ React23.createElement(
+    import_editor_ui11.PopoverHeader,
     {
       icon: /* @__PURE__ */ React23.createElement(VariableIcon, { fontSize: SIZE7 }),
       title: (0, import_i18n16.__)("Restore variable", "elementor"),
@@ -3383,11 +3380,11 @@ var VariableControl = () => {
 
 // src/hooks/use-prop-variable-action.tsx
 var React32 = __toESM(require("react"));
-var import_editor_editing_panel6 = require("@elementor/editor-editing-panel");
+var import_editor_editing_panel2 = require("@elementor/editor-editing-panel");
 var import_icons14 = require("@elementor/icons");
 var import_i18n23 = require("@wordpress/i18n");
 var usePropVariableAction = () => {
-  const { propType, path } = (0, import_editor_editing_panel6.useBoundProp)();
+  const { propType, path } = (0, import_editor_editing_panel2.useBoundProp)();
   const variable = resolveVariableFromPropType(propType);
   return {
     visible: Boolean(variable),
@@ -3541,7 +3538,7 @@ function initMcp() {
 // src/register-variable-types.tsx
 var React35 = __toESM(require("react"));
 var import_editor_props5 = require("@elementor/editor-props");
-var import_editor_ui11 = require("@elementor/editor-ui");
+var import_editor_ui13 = require("@elementor/editor-ui");
 var import_icons16 = require("@elementor/icons");
 
 // src/components/fields/color-field.tsx
@@ -3592,7 +3589,8 @@ var ColorField = ({ value, onChange, onValidationChange }) => {
 var React34 = __toESM(require("react"));
 var import_react24 = require("react");
 var import_editor_controls12 = require("@elementor/editor-controls");
-var import_editor_editing_panel7 = require("@elementor/editor-editing-panel");
+var import_editor_editing_panel3 = require("@elementor/editor-editing-panel");
+var import_editor_ui12 = require("@elementor/editor-ui");
 var import_icons15 = require("@elementor/icons");
 var import_ui32 = require("@elementor/ui");
 var import_i18n24 = require("@wordpress/i18n");
@@ -3601,8 +3599,8 @@ var FontField = ({ value, onChange, onValidationChange }) => {
   const defaultRef = (0, import_react24.useRef)(null);
   const anchorRef = usePopoverContentRef() ?? defaultRef.current;
   const fontPopoverState = (0, import_ui32.usePopupState)({ variant: "popover" });
-  const fontFamilies = (0, import_editor_editing_panel7.useFontFamilies)();
-  const sectionWidth = (0, import_editor_editing_panel7.useSectionWidth)();
+  const fontFamilies = (0, import_editor_editing_panel3.useFontFamilies)();
+  const sectionWidth = (0, import_editor_ui12.useSectionWidth)();
   const mapFontSubs = React34.useMemo(() => {
     return fontFamilies.map(({ label, fonts }) => ({
       label,
@@ -3698,7 +3696,7 @@ function registerVariableTypes() {
     styleTransformer: EmptyTransformer,
     variableType: "size",
     selectionFilter: () => [],
-    emptyState: /* @__PURE__ */ React35.createElement(import_editor_ui11.CtaButton, { size: "small", href: "https://go.elementor.com/go-pro-panel-size-variable/" })
+    emptyState: /* @__PURE__ */ React35.createElement(import_editor_ui13.CtaButton, { size: "small", href: "https://go.elementor.com/go-pro-panel-size-variable/" })
   };
   registerVariableType({
     ...sizePromotions,
@@ -3803,11 +3801,11 @@ var hasAssignedColorVariable = (propValue) => {
 };
 
 // src/init.ts
-var { registerPopoverAction } = import_editor_editing_panel8.controlActionsMenu;
+var { registerPopoverAction } = import_editor_editing_panel4.controlActionsMenu;
 function init() {
   registerVariableTypes();
   registerRepeaterInjections();
-  (0, import_editor_editing_panel8.registerControlReplacement)({
+  (0, import_editor_editing_panel4.registerControlReplacement)({
     component: VariableControl,
     condition: ({ value, placeholder }) => {
       if (hasVariableAssigned(value)) {