@elementor/editor-components 3.35.0-424 → 3.35.0-426

package/dist/index.js

@@ -44,7 +44,7 @@ var import_editor_panels4 = require("@elementor/editor-panels");
 var import_editor_styles_repository2 = require("@elementor/editor-styles-repository");
 var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
 var import_store78 = require("@elementor/store");
-var import_i18n27 = require("@wordpress/i18n");
+var import_i18n28 = require("@wordpress/i18n");
 
 // src/component-instance-transformer.ts
 var import_editor_canvas = require("@elementor/editor-canvas");
@@ -133,7 +133,7 @@ var slice = (0, import_store2.__createSlice)({
   reducers: {
     add: (state, { payload }) => {
       if (Array.isArray(payload)) {
-        state.data = [...state.data, ...payload];
+        state.data = [...payload, ...state.data];
       } else {
         state.data.unshift(payload);
       }
@@ -1700,7 +1700,7 @@ var import_react9 = require("react");
 var import_editor_mcp = require("@elementor/editor-mcp");
 var import_icons10 = require("@elementor/icons");
 var import_ui15 = require("@elementor/ui");
-var import_i18n17 = require("@wordpress/i18n");
+var import_i18n18 = require("@wordpress/i18n");
 
 // src/store/actions/rename-component.ts
 var import_editor_documents7 = require("@elementor/editor-documents");
@@ -2053,19 +2053,23 @@ var import_editor_elements8 = require("@elementor/editor-elements");
 var import_editor_ui6 = require("@elementor/editor-ui");
 var import_icons9 = require("@elementor/icons");
 var import_ui13 = require("@elementor/ui");
-var import_i18n16 = require("@wordpress/i18n");
+var import_i18n17 = require("@wordpress/i18n");
 
 // src/store/actions/archive-component.ts
 var import_editor_documents8 = require("@elementor/editor-documents");
+var import_editor_notifications = require("@elementor/editor-notifications");
 var import_store35 = require("@elementor/store");
-var archiveComponent = (componentId) => {
-  const store = (0, import_store35.__getStore)();
-  const dispatch18 = store?.dispatch;
-  if (!dispatch18) {
-    return;
-  }
-  dispatch18(slice.actions.archive(componentId));
+var import_i18n15 = require("@wordpress/i18n");
+var successNotification = (componentId, componentName) => ({
+  type: "success",
+  /* translators: %s: component name */
+  message: (0, import_i18n15.__)("Successfully deleted component %s", "elementor").replace("%s", componentName),
+  id: `success-archived-components-notification-${componentId}`
+});
+var archiveComponent = (componentId, componentName) => {
+  (0, import_store35.__dispatch)(slice.actions.archive(componentId));
   (0, import_editor_documents8.setDocumentModifiedStatus)(true);
+  (0, import_editor_notifications.notify)(successNotification(componentId, componentName));
 };
 
 // src/store/actions/load-components-assets.ts
@@ -2181,14 +2185,14 @@ var import_store41 = require("@elementor/store");
 
 // src/components/create-component-form/utils/component-form-schema.ts
 var import_schema = require("@elementor/schema");
-var import_i18n15 = require("@wordpress/i18n");
+var import_i18n16 = require("@wordpress/i18n");
 var MIN_NAME_LENGTH = 2;
 var MAX_NAME_LENGTH = 50;
-var baseComponentSchema = import_schema.z.string().trim().max(MAX_NAME_LENGTH, (0, import_i18n15.__)("Component name is too long. Please keep it under 50 characters.", "elementor"));
+var baseComponentSchema = import_schema.z.string().trim().max(MAX_NAME_LENGTH, (0, import_i18n16.__)("Component name is too long. Please keep it under 50 characters.", "elementor"));
 var createBaseComponentSchema = (existingNames) => {
   return import_schema.z.object({
     componentName: baseComponentSchema.refine((value) => !existingNames.includes(value), {
-      message: (0, import_i18n15.__)("Component name already exists", "elementor")
+      message: (0, import_i18n16.__)("Component name already exists", "elementor")
     })
   });
 };
@@ -2196,9 +2200,9 @@ var createSubmitComponentSchema = (existingNames) => {
   const baseSchema = createBaseComponentSchema(existingNames);
   return baseSchema.extend({
     componentName: baseSchema.shape.componentName.refine((value) => value.length > 0, {
-      message: (0, import_i18n15.__)("Component name is required.", "elementor")
+      message: (0, import_i18n16.__)("Component name is required.", "elementor")
     }).refine((value) => value.length >= MIN_NAME_LENGTH, {
-      message: (0, import_i18n15.__)("Component name is too short. Please enter at least 2 characters.", "elementor")
+      message: (0, import_i18n16.__)("Component name is too short. Please enter at least 2 characters.", "elementor")
     })
   });
 };
@@ -2320,7 +2324,7 @@ var ComponentItem = ({ component, renameComponent: renameComponent2 }) => {
     if (!component.id) {
       throw new Error("Component ID is required");
     }
-    archiveComponent(component.id);
+    archiveComponent(component.id, component.name);
   };
   return /* @__PURE__ */ React14.createElement(import_ui13.Stack, null, /* @__PURE__ */ React14.createElement(
     import_editor_ui6.WarningInfotip,
@@ -2403,9 +2407,9 @@ var ComponentItem = ({ component, renameComponent: renameComponent2 }) => {
           openEditMode();
         }
       },
-      (0, import_i18n16.__)("Rename", "elementor")
+      (0, import_i18n17.__)("Rename", "elementor")
     ),
-    /* @__PURE__ */ React14.createElement(import_editor_ui6.MenuListItem, { sx: { minWidth: "160px" }, onClick: handleArchiveClick }, /* @__PURE__ */ React14.createElement(import_ui13.Typography, { variant: "caption", sx: { color: "error.light" } }, (0, import_i18n16.__)("Archive", "elementor")))
+    /* @__PURE__ */ React14.createElement(import_editor_ui6.MenuListItem, { sx: { minWidth: "160px" }, onClick: handleArchiveClick }, /* @__PURE__ */ React14.createElement(import_ui13.Typography, { variant: "caption", sx: { color: "error.light" } }, (0, import_i18n17.__)("Delete", "elementor")))
   ));
 };
 var addComponentToPage = (model) => {
@@ -2524,7 +2528,7 @@ var EmptyState = () => {
     const sdk = (0, import_editor_mcp.getAngieSdk)();
     if (sdk.isAngieReady()) {
       sdk.triggerAngie({
-        prompt: (0, import_i18n17.__)(
+        prompt: (0, import_i18n18.__)(
           "Create a [hero/testimonial/product card/CTA/feature] component for my [business type]. Include [describe what you want]",
           "elementor"
         ),
@@ -2544,7 +2548,7 @@ var EmptyState = () => {
       gap: 2,
       overflow: "hidden"
     },
-    /* @__PURE__ */ React16.createElement(import_ui15.Stack, { alignItems: "center", gap: 1 }, /* @__PURE__ */ React16.createElement(import_icons10.ComponentsIcon, { fontSize: "large", sx: { color: "text.secondary" } }), /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "subtitle2", color: "text.secondary", sx: SUBTITLE_OVERRIDE_SX }, (0, import_i18n17.__)("No components yet", "elementor")), /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "secondary", sx: { maxWidth: 200 } }, (0, import_i18n17.__)("Components are reusable blocks that sync across your site.", "elementor"), /* @__PURE__ */ React16.createElement("br", null), (0, import_i18n17.__)("Create once, use everywhere.", "elementor")), /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React16.createElement(import_ui15.Stack, { alignItems: "center", gap: 1 }, /* @__PURE__ */ React16.createElement(import_icons10.ComponentsIcon, { fontSize: "large", sx: { color: "text.secondary" } }), /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "subtitle2", color: "text.secondary", sx: SUBTITLE_OVERRIDE_SX }, (0, import_i18n18.__)("No components yet", "elementor")), /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "secondary", sx: { maxWidth: 200 } }, (0, import_i18n18.__)("Components are reusable blocks that sync across your site.", "elementor"), /* @__PURE__ */ React16.createElement("br", null), (0, import_i18n18.__)("Create once, use everywhere.", "elementor")), /* @__PURE__ */ React16.createElement(
       import_ui15.Link,
       {
         href: LEARN_MORE_URL,
@@ -2553,13 +2557,13 @@ var EmptyState = () => {
         variant: "caption",
         color: "info.main"
       },
-      (0, import_i18n17.__)("Learn more about components", "elementor")
+      (0, import_i18n18.__)("Learn more about components", "elementor")
     )),
     /* @__PURE__ */ React16.createElement(import_ui15.Divider, { sx: { width: "100%" } }),
-    /* @__PURE__ */ React16.createElement(import_ui15.Stack, { alignItems: "center", gap: 1, width: "100%" }, /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "subtitle2", color: "text.secondary", sx: SUBTITLE_OVERRIDE_SX }, (0, import_i18n17.__)("Create your first one:", "elementor")), /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "secondary", sx: { maxWidth: 228 } }, (0, import_i18n17.__)(
+    /* @__PURE__ */ React16.createElement(import_ui15.Stack, { alignItems: "center", gap: 1, width: "100%" }, /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "subtitle2", color: "text.secondary", sx: SUBTITLE_OVERRIDE_SX }, (0, import_i18n18.__)("Create your first one:", "elementor")), /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "secondary", sx: { maxWidth: 228 } }, (0, import_i18n18.__)(
       'Right-click any div-block or flexbox on your canvas or structure and select "Create component"',
       "elementor"
-    )), /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "secondary" }, (0, import_i18n17.__)("Or", "elementor")), /* @__PURE__ */ React16.createElement(AngiePromotionModal, { open: isAngieModalOpen, onClose: () => setIsAngieModalOpen(false) }, /* @__PURE__ */ React16.createElement(
+    )), /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "secondary" }, (0, import_i18n18.__)("Or", "elementor")), /* @__PURE__ */ React16.createElement(AngiePromotionModal, { open: isAngieModalOpen, onClose: () => setIsAngieModalOpen(false) }, /* @__PURE__ */ React16.createElement(
       import_ui15.Button,
       {
         color: "secondary",
@@ -2568,7 +2572,7 @@ var EmptyState = () => {
         onClick: handleCreateWithAI,
         endIcon: /* @__PURE__ */ React16.createElement(import_icons10.AIIcon, null)
       },
-      (0, import_i18n17.__)("Create component with AI", "elementor")
+      (0, import_i18n18.__)("Create component with AI", "elementor")
     )))
   );
 };
@@ -2592,7 +2596,7 @@ var EmptySearchResult = () => {
           width: "100%"
         }
       },
-      /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "subtitle2", color: "inherit", sx: SUBTITLE_OVERRIDE_SX }, (0, import_i18n17.__)("Sorry, nothing matched", "elementor")),
+      /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "subtitle2", color: "inherit", sx: SUBTITLE_OVERRIDE_SX }, (0, import_i18n18.__)("Sorry, nothing matched", "elementor")),
       searchValue && /* @__PURE__ */ React16.createElement(
         import_ui15.Typography,
         {
@@ -2620,8 +2624,8 @@ var EmptySearchResult = () => {
         /* @__PURE__ */ React16.createElement("span", null, "\u201D.")
       )
     ),
-    /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "inherit" }, (0, import_i18n17.__)("Try something else.", "elementor")),
-    /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "inherit" }, /* @__PURE__ */ React16.createElement(import_ui15.Link, { color: "secondary", variant: "caption", component: "button", onClick: clearSearch }, (0, import_i18n17.__)("Clear & try again", "elementor")))
+    /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "inherit" }, (0, import_i18n18.__)("Try something else.", "elementor")),
+    /* @__PURE__ */ React16.createElement(import_ui15.Typography, { align: "center", variant: "caption", color: "inherit" }, /* @__PURE__ */ React16.createElement(import_ui15.Link, { color: "secondary", variant: "caption", component: "button", onClick: clearSearch }, (0, import_i18n18.__)("Clear & try again", "elementor")))
   );
 };
 var useFilteredComponents = () => {
@@ -2653,23 +2657,23 @@ var COMPONENT_DOCUMENT_TYPE = "elementor_component";
 var React18 = __toESM(require("react"));
 var import_react11 = require("react");
 var import_editor_elements10 = require("@elementor/editor-elements");
-var import_editor_notifications2 = require("@elementor/editor-notifications");
+var import_editor_notifications3 = require("@elementor/editor-notifications");
 var import_editor_ui8 = require("@elementor/editor-ui");
 var import_icons11 = require("@elementor/icons");
 var import_store47 = require("@elementor/store");
 var import_ui16 = require("@elementor/ui");
-var import_i18n19 = require("@wordpress/i18n");
+var import_i18n20 = require("@wordpress/i18n");
 
 // src/prevent-non-atomic-nesting.ts
 var import_editor_canvas6 = require("@elementor/editor-canvas");
 var import_editor_elements9 = require("@elementor/editor-elements");
-var import_editor_notifications = require("@elementor/editor-notifications");
+var import_editor_notifications2 = require("@elementor/editor-notifications");
 var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
 var import_store43 = require("@elementor/store");
-var import_i18n18 = require("@wordpress/i18n");
+var import_i18n19 = require("@wordpress/i18n");
 var NON_ATOMIC_ELEMENT_ALERT = {
   type: "default",
-  message: (0, import_i18n18.__)("This widget isn't compatible with components. Use atomic elements instead.", "elementor"),
+  message: (0, import_i18n19.__)("This widget isn't compatible with components. Use atomic elements instead.", "elementor"),
   id: "non-atomic-element-blocked"
 };
 function initNonAtomicNestingPrevention() {
@@ -2708,7 +2712,7 @@ function blockNonAtomicCreate(args) {
   if (isElementAtomic(elementType)) {
     return false;
   }
-  (0, import_editor_notifications.notify)(NON_ATOMIC_ELEMENT_ALERT);
+  (0, import_editor_notifications2.notify)(NON_ATOMIC_ELEMENT_ALERT);
   return true;
 }
 function blockNonAtomicMove(args) {
@@ -2724,7 +2728,7 @@ function blockNonAtomicMove(args) {
     return allElements.some((element) => !(0, import_editor_canvas6.isAtomicWidget)(element));
   });
   if (hasNonAtomicElement) {
-    (0, import_editor_notifications.notify)(NON_ATOMIC_ELEMENT_ALERT);
+    (0, import_editor_notifications2.notify)(NON_ATOMIC_ELEMENT_ALERT);
   }
   return hasNonAtomicElement;
 }
@@ -2742,7 +2746,7 @@ function blockNonAtomicPaste(args) {
   }
   const hasNonAtomicElement = hasNonAtomicElementsInTree(data.clipboard.elements);
   if (hasNonAtomicElement) {
-    (0, import_editor_notifications.notify)(NON_ATOMIC_ELEMENT_ALERT);
+    (0, import_editor_notifications2.notify)(NON_ATOMIC_ELEMENT_ALERT);
   }
   return hasNonAtomicElement;
 }
@@ -2881,16 +2885,15 @@ function countNestedElements(container) {
 function CreateComponentForm() {
   const [element, setElement] = (0, import_react11.useState)(null);
   const [anchorPosition, setAnchorPosition] = (0, import_react11.useState)();
-  const [resultNotification, setResultNotification] = (0, import_react11.useState)(null);
   const eventData = (0, import_react11.useRef)(null);
   (0, import_react11.useEffect)(() => {
     const OPEN_SAVE_AS_COMPONENT_FORM_EVENT = "elementor/editor/open-save-as-component-form";
     const openPopup = (event) => {
       const nonAtomicElements = findNonAtomicElementsInElement(event.detail.element);
       if (nonAtomicElements.length > 0) {
-        (0, import_editor_notifications2.notify)({
+        (0, import_editor_notifications3.notify)({
           type: "default",
-          message: (0, import_i18n19.__)(
+          message: (0, import_i18n20.__)(
             "Components require atomic elements only. Remove widgets to create this component.",
             "elementor"
           ),
@@ -2927,19 +2930,18 @@ function CreateComponentForm() {
       } else {
         throw new Error("Failed to find published component");
       }
-      setResultNotification({
-        show: true,
-        // Translators: %1$s: Component name, %2$s: Component UID
-        message: (0, import_i18n19.__)("Component saved successfully as: %1$s (UID: %2$s)", "elementor").replace("%1$s", values.componentName).replace("%2$s", uid),
-        type: "success"
+      (0, import_editor_notifications3.notify)({
+        type: "success",
+        message: (0, import_i18n20.__)("Component created successfully.", "elementor"),
+        id: `component-saved-successfully-${uid}`
       });
       resetAndClosePopup();
     } catch {
-      const errorMessage = (0, import_i18n19.__)("Failed to save component. Please try again.", "elementor");
-      setResultNotification({
-        show: true,
+      const errorMessage = (0, import_i18n20.__)("Failed to create component. Please try again.", "elementor");
+      (0, import_editor_notifications3.notify)({
+        type: "error",
         message: errorMessage,
-        type: "error"
+        id: "component-save-failed"
       });
     }
   };
@@ -2970,15 +2972,7 @@ function CreateComponentForm() {
         closePopup: cancelSave
       }
     )
-  ), /* @__PURE__ */ React18.createElement(import_ui16.Snackbar, { open: resultNotification?.show, onClose: () => setResultNotification(null) }, /* @__PURE__ */ React18.createElement(
-    import_ui16.Alert,
-    {
-      onClose: () => setResultNotification(null),
-      severity: resultNotification?.type,
-      sx: { width: "100%" }
-    },
-    resultNotification?.message
-  )));
+  ));
 }
 var FONT_SIZE = "tiny";
 var Form2 = ({
@@ -3006,10 +3000,10 @@ var Form2 = ({
     }
   };
   const texts = {
-    heading: (0, import_i18n19.__)("Save as a component", "elementor"),
-    name: (0, import_i18n19.__)("Name", "elementor"),
-    cancel: (0, import_i18n19.__)("Cancel", "elementor"),
-    create: (0, import_i18n19.__)("Create", "elementor")
+    heading: (0, import_i18n20.__)("Create component", "elementor"),
+    name: (0, import_i18n20.__)("Name", "elementor"),
+    cancel: (0, import_i18n20.__)("Cancel", "elementor"),
+    create: (0, import_i18n20.__)("Create", "elementor")
   };
   const nameInputId = "component-name";
   return /* @__PURE__ */ React18.createElement(import_editor_ui8.Form, { onSubmit: handleSubmit }, /* @__PURE__ */ React18.createElement(import_ui16.Stack, { alignItems: "start", width: "268px" }, /* @__PURE__ */ React18.createElement(
@@ -3021,7 +3015,7 @@ var Form2 = ({
       px: 1.5,
       sx: { columnGap: 0.5, borderBottom: "1px solid", borderColor: "divider", width: "100%" }
     },
-    /* @__PURE__ */ React18.createElement(import_icons11.StarIcon, { fontSize: FONT_SIZE }),
+    /* @__PURE__ */ React18.createElement(import_icons11.ComponentsIcon, { fontSize: FONT_SIZE }),
     /* @__PURE__ */ React18.createElement(import_ui16.Typography, { variant: "caption", sx: { color: "text.primary", fontWeight: "500", lineHeight: 1 } }, texts.heading)
   ), /* @__PURE__ */ React18.createElement(import_ui16.Grid, { container: true, gap: 0.75, alignItems: "start", p: 1.5 }, /* @__PURE__ */ React18.createElement(import_ui16.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React18.createElement(import_ui16.FormLabel, { htmlFor: nameInputId, size: "tiny" }, texts.name)), /* @__PURE__ */ React18.createElement(import_ui16.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React18.createElement(
     import_ui16.TextField,
@@ -3053,19 +3047,19 @@ function updateCurrentComponent({
   path,
   currentComponentId
 }) {
-  const dispatch18 = (0, import_store49.__getStore)()?.dispatch;
-  if (!dispatch18) {
+  const dispatch19 = (0, import_store49.__getStore)()?.dispatch;
+  if (!dispatch19) {
     return;
   }
-  dispatch18(slice.actions.setPath(path));
-  dispatch18(slice.actions.setCurrentComponentId(currentComponentId));
+  dispatch19(slice.actions.setPath(path));
+  dispatch19(slice.actions.setCurrentComponentId(currentComponentId));
 }
 
 // src/components/edit-component/component-modal.tsx
 var React19 = __toESM(require("react"));
 var import_react13 = require("react");
 var import_react_dom = require("react-dom");
-var import_i18n20 = require("@wordpress/i18n");
+var import_i18n21 = require("@wordpress/i18n");
 
 // src/hooks/use-canvas-document.ts
 var import_editor_canvas7 = require("@elementor/editor-canvas");
@@ -3187,7 +3181,7 @@ function Backdrop({ canvas, element, onClose }) {
       onKeyDown: handleKeyDown,
       role: "button",
       tabIndex: 0,
-      "aria-label": (0, import_i18n20.__)("Exit component editing mode", "elementor")
+      "aria-label": (0, import_i18n21.__)("Exit component editing mode", "elementor")
     }
   );
 }
@@ -3324,18 +3318,18 @@ var React21 = __toESM(require("react"));
 var import_editor_ui9 = require("@elementor/editor-ui");
 var import_icons12 = require("@elementor/icons");
 var import_ui17 = require("@elementor/ui");
-var import_i18n21 = require("@wordpress/i18n");
+var import_i18n22 = require("@wordpress/i18n");
 var openEditModeDialog = (lockedBy) => {
   (0, import_editor_ui9.openDialog)({
     component: /* @__PURE__ */ React21.createElement(EditModeDialog, { lockedBy })
   });
 };
 var EditModeDialog = ({ lockedBy }) => {
-  const content = (0, import_i18n21.__)("%s is currently editing this document", "elementor").replace("%s", lockedBy);
-  return /* @__PURE__ */ React21.createElement(React21.Fragment, null, /* @__PURE__ */ React21.createElement(import_ui17.DialogHeader, { logo: false }, /* @__PURE__ */ React21.createElement(import_ui17.Box, { display: "flex", alignItems: "center", gap: 1 }, /* @__PURE__ */ React21.createElement(import_ui17.Icon, { color: "secondary" }, /* @__PURE__ */ React21.createElement(import_icons12.InfoCircleFilledIcon, { fontSize: "medium" })), /* @__PURE__ */ React21.createElement(import_ui17.Typography, { variant: "subtitle1" }, content))), /* @__PURE__ */ React21.createElement(import_ui17.DialogContent, null, /* @__PURE__ */ React21.createElement(import_ui17.Stack, { spacing: 2, direction: "column" }, /* @__PURE__ */ React21.createElement(import_ui17.Typography, { variant: "body2" }, (0, import_i18n21.__)(
+  const content = (0, import_i18n22.__)("%s is currently editing this document", "elementor").replace("%s", lockedBy);
+  return /* @__PURE__ */ React21.createElement(React21.Fragment, null, /* @__PURE__ */ React21.createElement(import_ui17.DialogHeader, { logo: false }, /* @__PURE__ */ React21.createElement(import_ui17.Box, { display: "flex", alignItems: "center", gap: 1 }, /* @__PURE__ */ React21.createElement(import_ui17.Icon, { color: "secondary" }, /* @__PURE__ */ React21.createElement(import_icons12.InfoCircleFilledIcon, { fontSize: "medium" })), /* @__PURE__ */ React21.createElement(import_ui17.Typography, { variant: "subtitle1" }, content))), /* @__PURE__ */ React21.createElement(import_ui17.DialogContent, null, /* @__PURE__ */ React21.createElement(import_ui17.Stack, { spacing: 2, direction: "column" }, /* @__PURE__ */ React21.createElement(import_ui17.Typography, { variant: "body2" }, (0, import_i18n22.__)(
     "You can wait for them to finish or reach out to coordinate your changes together.",
     "elementor"
-  )), /* @__PURE__ */ React21.createElement(import_ui17.DialogActions, null, /* @__PURE__ */ React21.createElement(import_ui17.Button, { color: "secondary", variant: "contained", onClick: import_editor_ui9.closeDialog }, (0, import_i18n21.__)("Close", "elementor"))))));
+  )), /* @__PURE__ */ React21.createElement(import_ui17.DialogActions, null, /* @__PURE__ */ React21.createElement(import_ui17.Button, { color: "secondary", variant: "contained", onClick: import_editor_ui9.closeDialog }, (0, import_i18n22.__)("Close", "elementor"))))));
 };
 
 // src/components/instance-editing-panel/instance-editing-panel.tsx
@@ -3346,7 +3340,7 @@ var import_editor_elements14 = require("@elementor/editor-elements");
 var import_editor_panels3 = require("@elementor/editor-panels");
 var import_icons14 = require("@elementor/icons");
 var import_ui22 = require("@elementor/ui");
-var import_i18n23 = require("@wordpress/i18n");
+var import_i18n24 = require("@wordpress/i18n");
 
 // src/hooks/use-component-instance-settings.ts
 var import_editor_editing_panel2 = require("@elementor/editor-editing-panel");
@@ -3415,7 +3409,7 @@ function useComponentInstanceSettings() {
 var React22 = __toESM(require("react"));
 var import_icons13 = require("@elementor/icons");
 var import_ui18 = require("@elementor/ui");
-var import_i18n22 = require("@wordpress/i18n");
+var import_i18n23 = require("@wordpress/i18n");
 var EmptyState2 = ({ onEditComponent }) => {
   return /* @__PURE__ */ React22.createElement(
     import_ui18.Stack,
@@ -3428,12 +3422,12 @@ var EmptyState2 = ({ onEditComponent }) => {
       gap: 1.5
     },
     /* @__PURE__ */ React22.createElement(import_icons13.ComponentPropListIcon, { fontSize: "large" }),
-    /* @__PURE__ */ React22.createElement(import_ui18.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n22.__)("No properties yet", "elementor")),
-    /* @__PURE__ */ React22.createElement(import_ui18.Typography, { align: "center", variant: "caption", maxWidth: "170px" }, (0, import_i18n22.__)(
+    /* @__PURE__ */ React22.createElement(import_ui18.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n23.__)("No properties yet", "elementor")),
+    /* @__PURE__ */ React22.createElement(import_ui18.Typography, { align: "center", variant: "caption", maxWidth: "170px" }, (0, import_i18n23.__)(
       "Edit the component to add properties, manage them or update the design across all instances.",
       "elementor"
     )),
-    /* @__PURE__ */ React22.createElement(import_ui18.Button, { variant: "outlined", color: "secondary", size: "small", sx: { mt: 1 }, onClick: onEditComponent }, /* @__PURE__ */ React22.createElement(import_icons13.PencilIcon, { fontSize: "small" }), (0, import_i18n22.__)("Edit component", "elementor"))
+    /* @__PURE__ */ React22.createElement(import_ui18.Button, { variant: "outlined", color: "secondary", size: "small", sx: { mt: 1 }, onClick: onEditComponent }, /* @__PURE__ */ React22.createElement(import_icons13.PencilIcon, { fontSize: "small" }), (0, import_i18n23.__)("Edit component", "elementor"))
   );
 };
 
@@ -3707,7 +3701,7 @@ function InstanceEditingPanel() {
   if (!componentId || !overridableProps || !component) {
     return null;
   }
-  const panelTitle = (0, import_i18n23.__)("Edit %s", "elementor").replace("%s", component.name);
+  const panelTitle = (0, import_i18n24.__)("Edit %s", "elementor").replace("%s", component.name);
   const handleEditComponent = () => switchToComponent(componentId, componentInstanceId);
   const isNonEmptyGroup = (group) => group !== null && group.props.length > 0;
   const groups = overridableProps.groups.order.map((groupId) => overridableProps.groups.items[groupId] ?? null).filter(isNonEmptyGroup);
@@ -3793,7 +3787,7 @@ var import_editor_controls6 = require("@elementor/editor-controls");
 var import_editor_editing_panel7 = require("@elementor/editor-editing-panel");
 var import_editor_elements15 = require("@elementor/editor-elements");
 var import_ui24 = require("@elementor/ui");
-var import_i18n25 = require("@wordpress/i18n");
+var import_i18n26 = require("@wordpress/i18n");
 
 // src/store/actions/set-overridable-prop.ts
 var import_store58 = require("@elementor/store");
@@ -3864,7 +3858,7 @@ var React29 = __toESM(require("react"));
 var import_react17 = require("react");
 var import_icons15 = require("@elementor/icons");
 var import_ui23 = require("@elementor/ui");
-var import_i18n24 = require("@wordpress/i18n");
+var import_i18n25 = require("@wordpress/i18n");
 var SIZE2 = "tiny";
 var IconContainer = (0, import_ui23.styled)(import_ui23.Box)`
 	pointer-events: none;
@@ -3924,7 +3918,7 @@ var Indicator2 = (0, import_react17.forwardRef)(({ isOpen, isOverridable, ...pro
   IconContainer,
   {
     className: "icon",
-    "aria-label": isOverridable ? (0, import_i18n24.__)("Overridable property", "elementor") : (0, import_i18n24.__)("Make prop overridable", "elementor")
+    "aria-label": isOverridable ? (0, import_i18n25.__)("Overridable property", "elementor") : (0, import_i18n25.__)("Make prop overridable", "elementor")
   },
   isOverridable ? /* @__PURE__ */ React29.createElement(import_icons15.CheckIcon, { fontSize: SIZE2 }) : /* @__PURE__ */ React29.createElement(import_icons15.PlusIcon, { fontSize: SIZE2 })
 )));
@@ -3995,7 +3989,7 @@ function Content2({ componentId, overridableProps }) {
     popupState.close();
   };
   const overridableConfig = overridableValue ? getOverridableProp({ componentId, overrideKey: overridableValue.override_key }) : void 0;
-  return /* @__PURE__ */ React30.createElement(React30.Fragment, null, /* @__PURE__ */ React30.createElement(import_ui24.Tooltip, { placement: "top", title: (0, import_i18n25.__)("Override Property", "elementor") }, /* @__PURE__ */ React30.createElement(Indicator2, { ...triggerProps, isOpen: !!popoverProps.open, isOverridable: !!overridableValue })), /* @__PURE__ */ React30.createElement(
+  return /* @__PURE__ */ React30.createElement(React30.Fragment, null, /* @__PURE__ */ React30.createElement(import_ui24.Tooltip, { placement: "top", title: (0, import_i18n26.__)("Override Property", "elementor") }, /* @__PURE__ */ React30.createElement(Indicator2, { ...triggerProps, isOpen: !!popoverProps.open, isOverridable: !!overridableValue })), /* @__PURE__ */ React30.createElement(
     import_ui24.Popover,
     {
       disableScrollLock: true,
@@ -4455,14 +4449,14 @@ function PopulateStore() {
 
 // src/prevent-circular-nesting.ts
 var import_editor_elements18 = require("@elementor/editor-elements");
-var import_editor_notifications3 = require("@elementor/editor-notifications");
+var import_editor_notifications4 = require("@elementor/editor-notifications");
 var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
 var import_store64 = require("@elementor/store");
-var import_i18n26 = require("@wordpress/i18n");
+var import_i18n27 = require("@wordpress/i18n");
 var COMPONENT_TYPE = "e-component";
 var COMPONENT_CIRCULAR_NESTING_ALERT = {
   type: "default",
-  message: (0, import_i18n26.__)("Can't add this component - components that contain each other can't be nested.", "elementor"),
+  message: (0, import_i18n27.__)("Can't add this component - components that contain each other can't be nested.", "elementor"),
   id: "circular-component-nesting-blocked"
 };
 function initCircularNestingPrevention() {
@@ -4539,7 +4533,7 @@ function blockCircularCreate(args) {
   }
   const isBlocked = wouldCreateCircularNesting(componentId);
   if (isBlocked) {
-    (0, import_editor_notifications3.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
+    (0, import_editor_notifications4.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
   }
   return isBlocked;
 }
@@ -4559,7 +4553,7 @@ function blockCircularMove(args) {
     });
   });
   if (hasCircularComponent) {
-    (0, import_editor_notifications3.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
+    (0, import_editor_notifications4.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
   }
   return hasCircularComponent;
 }
@@ -4575,7 +4569,7 @@ function blockCircularPaste(args) {
   const allComponentIds = extractComponentIdsFromElements(data.clipboard.elements);
   const hasCircularComponent = allComponentIds.some(wouldCreateCircularNesting);
   if (hasCircularComponent) {
-    (0, import_editor_notifications3.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
+    (0, import_editor_notifications4.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
   }
   return hasCircularComponent;
 }
@@ -4708,18 +4702,13 @@ var setComponentOverridablePropsSettingsBeforeSave = ({
 };
 
 // src/sync/update-archived-component-before-save.ts
-var import_editor_notifications4 = require("@elementor/editor-notifications");
+var import_editor_notifications5 = require("@elementor/editor-notifications");
 var import_store74 = require("@elementor/store");
 var failedNotification = (message) => ({
   type: "error",
   message: `Failed to archive components: ${message}`,
   id: "failed-archived-components-notification"
 });
-var successNotification = (message) => ({
-  type: "success",
-  message: `Successfully archived components: ${message}`,
-  id: "success-archived-components-notification"
-});
 var updateArchivedComponentBeforeSave = async () => {
   try {
     const archivedComponents = selectArchivedComponents((0, import_store74.__getState)());
@@ -4730,12 +4719,8 @@ var updateArchivedComponentBeforeSave = async () => {
       archivedComponents.map((component) => component.id)
     );
     const failedIds = result.failedIds.join(", ");
-    const successIds = result.successIds.join(", ");
     if (failedIds) {
-      (0, import_editor_notifications4.notify)(failedNotification(failedIds));
-    }
-    if (successIds) {
-      (0, import_editor_notifications4.notify)(successNotification(successIds));
+      (0, import_editor_notifications5.notify)(failedNotification(failedIds));
     }
   } catch (error) {
     throw new Error(`Failed to update archived components: ${error}`);
@@ -4803,8 +4788,9 @@ function init() {
   window.elementorCommon.__beforeSave = beforeSave;
   (0, import_editor_elements_panel.injectTab)({
     id: "components",
-    label: (0, import_i18n27.__)("Components", "elementor"),
-    component: Components
+    label: (0, import_i18n28.__)("Components", "elementor"),
+    component: Components,
+    position: 1
   });
   (0, import_editor.injectIntoTop)({
     id: "create-component-popup",