@elementor/editor-variables 3.33.0-175 → 3.33.0-176

package/dist/index.js

@@ -2144,6 +2144,7 @@ var EditConfirmationDialog = ({
 
 // src/components/variable-edit.tsx
 var SIZE3 = "tiny";
+var DELETE_LABEL = (0, import_i18n12.__)("Delete variable", "elementor");
 var VariableEdit = ({ onClose, onGoBack, onSubmit, editId }) => {
   const { icon: VariableIcon, valueField: ValueField, variableType } = useVariableType();
   const { setVariableValue: notifyBoundPropChange, variableId } = useVariableBoundProp();
@@ -2224,16 +2225,7 @@ var VariableEdit = ({ onClose, onGoBack, onSubmit, editId }) => {
   const actions = [];
   if (userPermissions.canDelete()) {
     actions.push(
-      /* @__PURE__ */ React17.createElement(
-        import_ui17.IconButton,
-        {
-          key: "delete",
-          size: SIZE3,
-          "aria-label": (0, import_i18n12.__)("Delete", "elementor"),
-          onClick: handleDeleteConfirmation
-        },
-        /* @__PURE__ */ React17.createElement(import_icons8.TrashIcon, { fontSize: SIZE3 })
-      )
+      /* @__PURE__ */ React17.createElement(import_ui17.Tooltip, { key: "delete", placement: "top", title: DELETE_LABEL }, /* @__PURE__ */ React17.createElement(import_ui17.IconButton, { size: SIZE3, onClick: handleDeleteConfirmation, "aria-label": DELETE_LABEL }, /* @__PURE__ */ React17.createElement(import_icons8.TrashIcon, { fontSize: SIZE3 })))
     );
   }
   const hasEmptyFields = () => {
@@ -2340,6 +2332,7 @@ var import_icons9 = require("@elementor/icons");
 var import_ui18 = require("@elementor/ui");
 var import_i18n13 = require("@wordpress/i18n");
 var SIZE4 = "tiny";
+var EDIT_LABEL = (0, import_i18n13.__)("Edit variable", "elementor");
 var MenuItemContent = ({ item }) => {
   const onEdit = item.onEdit;
   return /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(import_ui18.ListItemIcon, null, item.icon), /* @__PURE__ */ React18.createElement(
@@ -2375,7 +2368,7 @@ var MenuItemContent = ({ item }) => {
         maxWidth: "50%"
       }
     )
-  ), !!onEdit && /* @__PURE__ */ React18.createElement(
+  ), !!onEdit && /* @__PURE__ */ React18.createElement(import_ui18.Tooltip, { placement: "top", title: EDIT_LABEL }, /* @__PURE__ */ React18.createElement(
     import_ui18.IconButton,
     {
       sx: { mx: 1, opacity: "0" },
@@ -2383,10 +2376,10 @@ var MenuItemContent = ({ item }) => {
         e.stopPropagation();
         onEdit(item.value);
       },
-      "aria-label": (0, import_i18n13.__)("Edit", "elementor")
+      "aria-label": EDIT_LABEL
     },
     /* @__PURE__ */ React18.createElement(import_icons9.EditIcon, { color: "action", fontSize: SIZE4 })
-  ));
+  )));
 };
 
 // src/components/ui/styled-menu-list.tsx
@@ -2423,6 +2416,8 @@ var VariablesStyledMenuList = (0, import_ui19.styled)(import_ui19.MenuList)(({ t
 
 // src/components/variables-selection.tsx
 var SIZE5 = "tiny";
+var CREATE_LABEL = (0, import_i18n14.__)("Create variable", "elementor");
+var MANAGER_LABEL = (0, import_i18n14.__)("Variable Manager", "elementor");
 var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings }) => {
   const { icon: VariableIcon, startIcon, variableType, propTypeUtil } = useVariableType();
   const { value: variable, setValue: setVariable, path } = useVariableBoundProp();
@@ -2453,12 +2448,30 @@ var VariablesSelection = ({ closePopover, onAdd, onEdit, onSettings }) => {
   const actions = [];
   if (onAdd) {
     actions.push(
-      /* @__PURE__ */ React19.createElement(import_ui20.IconButton, { id: "add-variable-button", key: "add", size: SIZE5, onClick: onAddAndTrack }, /* @__PURE__ */ React19.createElement(import_icons10.PlusIcon, { fontSize: SIZE5 }))
+      /* @__PURE__ */ React19.createElement(import_ui20.Tooltip, { key: "add", placement: "top", title: CREATE_LABEL }, /* @__PURE__ */ React19.createElement(
+        import_ui20.IconButton,
+        {
+          id: "add-variable-button",
+          size: SIZE5,
+          onClick: onAddAndTrack,
+          "aria-label": CREATE_LABEL
+        },
+        /* @__PURE__ */ React19.createElement(import_icons10.PlusIcon, { fontSize: SIZE5 })
+      ))
     );
   }
   if (onSettings) {
     actions.push(
-      /* @__PURE__ */ React19.createElement(import_ui20.IconButton, { id: "variables-manager-button", key: "settings", size: SIZE5, onClick: onSettings }, /* @__PURE__ */ React19.createElement(import_icons10.SettingsIcon, { fontSize: SIZE5 }))
+      /* @__PURE__ */ React19.createElement(import_ui20.Tooltip, { key: "settings", placement: "top", title: MANAGER_LABEL }, /* @__PURE__ */ React19.createElement(
+        import_ui20.IconButton,
+        {
+          id: "variables-manager-button",
+          size: SIZE5,
+          onClick: onSettings,
+          "aria-label": MANAGER_LABEL
+        },
+        /* @__PURE__ */ React19.createElement(import_icons10.SettingsIcon, { fontSize: SIZE5 })
+      ))
     );
   }
   const StartIcon = startIcon || (() => /* @__PURE__ */ React19.createElement(VariableIcon, { fontSize: SIZE5 }));
@@ -2630,11 +2643,12 @@ var import_icons11 = require("@elementor/icons");
 var import_ui21 = require("@elementor/ui");
 var import_i18n15 = require("@wordpress/i18n");
 var SIZE6 = "tiny";
+var UNLINK_LABEL = (0, import_i18n15.__)("Unlink variable", "elementor");
 var AssignedTag = ({ startIcon, label, onUnlink, ...props }) => {
   const actions = [];
   if (onUnlink) {
     actions.push(
-      /* @__PURE__ */ React21.createElement(import_ui21.IconButton, { key: "unlink", size: SIZE6, onClick: onUnlink, "aria-label": (0, import_i18n15.__)("Unlink", "elementor") }, /* @__PURE__ */ React21.createElement(import_icons11.DetachIcon, { fontSize: SIZE6 }))
+      /* @__PURE__ */ React21.createElement(import_ui21.Tooltip, { key: "unlink", title: UNLINK_LABEL, placement: "bottom" }, /* @__PURE__ */ React21.createElement(import_ui21.IconButton, { size: SIZE6, onClick: onUnlink, "aria-label": UNLINK_LABEL }, /* @__PURE__ */ React21.createElement(import_icons11.DetachIcon, { fontSize: SIZE6 })))
     );
   }
   return /* @__PURE__ */ React21.createElement(import_ui21.Tooltip, { title: label, placement: "top" }, /* @__PURE__ */ React21.createElement(