@elementor/editor-components 4.0.0-665 → 4.0.0-667

package/dist/index.js

@@ -85,16 +85,15 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/init.ts
-var import_editor2 = require("@elementor/editor");
-var import_editor_canvas8 = require("@elementor/editor-canvas");
-var import_editor_documents14 = require("@elementor/editor-documents");
-var import_editor_editing_panel9 = require("@elementor/editor-editing-panel");
-var import_editor_elements_panel2 = require("@elementor/editor-elements-panel");
+var import_editor = require("@elementor/editor");
+var import_editor_canvas5 = require("@elementor/editor-canvas");
+var import_editor_documents6 = require("@elementor/editor-documents");
+var import_editor_editing_panel5 = require("@elementor/editor-editing-panel");
+var import_editor_elements_panel = require("@elementor/editor-elements-panel");
 var import_editor_styles_repository2 = require("@elementor/editor-styles-repository");
-var import_editor_v1_adapters14 = require("@elementor/editor-v1-adapters");
-var import_store46 = require("@elementor/store");
-var import_utils13 = require("@elementor/utils");
-var import_i18n36 = require("@wordpress/i18n");
+var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
+var import_store35 = require("@elementor/store");
+var import_i18n12 = require("@wordpress/i18n");
 
 // src/component-instance-transformer.ts
 var import_editor_canvas = require("@elementor/editor-canvas");
@@ -110,10 +109,10 @@ var import_store = require("@elementor/store");
 var import_editor_v1_adapters = require("@elementor/editor-v1-adapters");
 var import_http_client = require("@elementor/http-client");
 var BASE_URL = "elementor/v1/components";
-var getParams = (id2) => ({
+var getParams = (id) => ({
   action: "get_document_config",
-  unique_id: `document-config-${id2}`,
-  data: { id: id2 }
+  unique_id: `document-config-${id}`,
+  data: { id }
 });
 var apiClient = {
   get: () => (0, import_http_client.httpService)().get(`${BASE_URL}`).then((res) => res.data.data),
@@ -122,8 +121,8 @@ var apiClient = {
     ids,
     status
   }),
-  getComponentConfig: (id2) => import_editor_v1_adapters.ajax.load(getParams(id2)),
-  invalidateComponentConfigCache: (id2) => import_editor_v1_adapters.ajax.invalidateCache(getParams(id2)),
+  getComponentConfig: (id) => import_editor_v1_adapters.ajax.load(getParams(id)),
+  invalidateComponentConfigCache: (id) => import_editor_v1_adapters.ajax.invalidateCache(getParams(id)),
   getComponentLockStatus: async (componentId) => await (0, import_http_client.httpService)().get(`${BASE_URL}/lock-status`, {
     params: {
       componentId
@@ -377,10 +376,10 @@ var useIsSanitizedComponent = (componentId, key) => {
 
 // src/utils/component-document-data.ts
 var import_editor_documents = require("@elementor/editor-documents");
-var getComponentDocumentData = async (id2) => {
+var getComponentDocumentData = async (id) => {
   const documentManager = (0, import_editor_documents.getV1DocumentsManager)();
   try {
-    return await documentManager.request(id2);
+    return await documentManager.request(id);
   } catch {
     return null;
   }
@@ -389,11 +388,11 @@ var getComponentDocumentData = async (id2) => {
 // src/component-instance-transformer.ts
 var componentInstanceTransformer = (0, import_editor_canvas.createTransformer)(
   async ({
-    component_id: id2,
+    component_id: id,
     overrides: overridesValue
   }) => {
     const unpublishedComponents = selectUnpublishedComponents((0, import_store3.__getState)());
-    const unpublishedComponent = unpublishedComponents.find(({ uid }) => uid === id2);
+    const unpublishedComponent = unpublishedComponents.find(({ uid }) => uid === id);
     const overrides = overridesValue?.reduce((acc, override) => ({ ...acc, ...override }), {});
     if (unpublishedComponent) {
       return {
@@ -401,10 +400,10 @@ var componentInstanceTransformer = (0, import_editor_canvas.createTransformer)(
         overrides
       };
     }
-    if (typeof id2 !== "number") {
-      throw new Error(`Component ID "${id2}" not valid.`);
+    if (typeof id !== "number") {
+      throw new Error(`Component ID "${id}" not valid.`);
     }
-    const data = await getComponentDocumentData(id2);
+    const data = await getComponentDocumentData(id);
     return {
       elements: data?.elements ?? [],
       overrides
@@ -1443,8 +1442,8 @@ var componentsActions = {
   resetUnpublished() {
     (0, import_store11.__dispatch)(slice.actions.resetUnpublished());
   },
-  removeStyles(id2) {
-    (0, import_store11.__dispatch)(slice.actions.removeStyles({ id: id2 }));
+  removeStyles(id) {
+    (0, import_store11.__dispatch)(slice.actions.removeStyles({ id }));
   },
   addStyles(styles) {
     (0, import_store11.__dispatch)(slice.actions.addStyles(styles));
@@ -1458,8 +1457,8 @@ var componentsActions = {
   archive(componentId) {
     (0, import_store11.__dispatch)(slice.actions.archive(componentId));
   },
-  setCurrentComponentId(id2) {
-    safeDispatch()?.(slice.actions.setCurrentComponentId(id2));
+  setCurrentComponentId(id) {
+    safeDispatch()?.(slice.actions.setCurrentComponentId(id));
   },
   setPath(path) {
     safeDispatch()?.(slice.actions.setPath(path));
@@ -1928,9 +1927,9 @@ function OverridePropsGroup({ group }) {
   const handleClick = () => {
     setIsOpen(!isOpen);
   };
-  const id2 = (0, import_react6.useId)();
-  const labelId = `label-${id2}`;
-  const contentId = `content-${id2}`;
+  const id = (0, import_react6.useId)();
+  const labelId = `label-${id}`;
+  const contentId = `content-${id}`;
   const title = group.label;
   return /* @__PURE__ */ React17.createElement(import_ui11.Box, { "aria-label": `${title} section` }, /* @__PURE__ */ React17.createElement(
     import_ui11.ListItemButton,
@@ -2124,12 +2123,12 @@ async function getComponentIds(elements, cache) {
 }
 async function getDocumentsMap(ids, cache) {
   const documents = await Promise.all(
-    ids.map(async (id2) => {
-      const document = await cache.get(id2);
+    ids.map(async (id) => {
+      const document = await cache.get(id);
       if (!document) {
         return null;
       }
-      return [id2, document];
+      return [id, document];
     })
   );
   return new Map(documents.filter((document) => document !== null));
@@ -2167,7 +2166,7 @@ function loadComponentsStyles(documents) {
     return;
   }
   const knownComponents = selectStyles((0, import_store24.__getState)());
-  const unknownDocuments = new Map([...documents.entries()].filter(([id2]) => !knownComponents[id2]));
+  const unknownDocuments = new Map([...documents.entries()].filter(([id]) => !knownComponents[id]));
   if (!unknownDocuments.size) {
     return;
   }
@@ -2175,7 +2174,7 @@ function loadComponentsStyles(documents) {
 }
 function addStyles(documents) {
   const styles = Object.fromEntries(
-    [...documents.entries()].map(([id2, document]) => [id2, extractStylesFromDocument(document)])
+    [...documents.entries()].map(([id, document]) => [id, extractStylesFromDocument(document)])
   );
   (0, import_store24.__dispatch)(slice.actions.addStyles(styles));
 }
@@ -2229,10 +2228,10 @@ var ELEMENT_ID_LENGTH = 7;
 function formatComponentElementsId(elements, path) {
   return elements.map((element) => {
     const nestingPath = [...path, element.id];
-    const id2 = (0, import_utils3.hashString)(nestingPath.join("_"), ELEMENT_ID_LENGTH);
+    const id = (0, import_utils3.hashString)(nestingPath.join("_"), ELEMENT_ID_LENGTH);
     return {
       ...element,
-      id: id2,
+      id,
       originId: element.id,
       elements: element.elements ? formatComponentElementsId(element.elements, nestingPath) : void 0
     };
@@ -2592,3871 +2591,200 @@ function createComponentModel() {
   });
 }
 
-// src/extended/init.ts
-var import_editor = require("@elementor/editor");
-var import_editor_controls7 = require("@elementor/editor-controls");
-var import_editor_documents13 = require("@elementor/editor-documents");
-var import_editor_editing_panel8 = require("@elementor/editor-editing-panel");
-var import_editor_elements_panel = require("@elementor/editor-elements-panel");
-var import_editor_panels6 = require("@elementor/editor-panels");
-var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
-var import_i18n34 = require("@wordpress/i18n");
-
-// src/extended/components/component-panel-header/component-panel-header.tsx
-var React29 = __toESM(require("react"));
-var import_editor_current_user2 = require("@elementor/editor-current-user");
-var import_editor_documents8 = require("@elementor/editor-documents");
-var import_editor_panels5 = require("@elementor/editor-panels");
-var import_editor_ui13 = require("@elementor/editor-ui");
-var import_icons16 = require("@elementor/icons");
-var import_store32 = require("@elementor/store");
-var import_ui23 = require("@elementor/ui");
-var import_i18n22 = require("@wordpress/i18n");
-
-// src/extended/hooks/use-navigate-back.ts
+// src/populate-store.ts
 var import_react8 = require("react");
-var import_editor_documents5 = require("@elementor/editor-documents");
 var import_store28 = require("@elementor/store");
-function useNavigateBack() {
-  const path = (0, import_store28.__useSelector)(selectPath);
-  const documentsManager = (0, import_editor_documents5.getV1DocumentsManager)();
-  return (0, import_react8.useCallback)(() => {
-    const { componentId: prevComponentId, instanceId: prevComponentInstanceId } = path.at(-2) ?? {};
-    if (prevComponentId && prevComponentInstanceId) {
-      switchToComponent(prevComponentId, prevComponentInstanceId);
-      return;
-    }
-    switchToComponent(documentsManager.getInitialId());
-  }, [path, documentsManager]);
+function PopulateStore() {
+  (0, import_react8.useEffect)(() => {
+    (0, import_store28.__dispatch)(loadComponents());
+  }, []);
+  return null;
 }
 
-// src/extended/components/component-introduction.tsx
-var React20 = __toESM(require("react"));
-var import_editor_controls4 = require("@elementor/editor-controls");
-var import_editor_ui8 = require("@elementor/editor-ui");
-var import_ui14 = require("@elementor/ui");
+// src/prevent-circular-nesting.ts
+var import_editor_elements9 = require("@elementor/editor-elements");
+var import_editor_notifications3 = require("@elementor/editor-notifications");
+var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
+var import_store29 = require("@elementor/store");
 var import_i18n11 = require("@wordpress/i18n");
-var ComponentIntroduction = ({
-  anchorRef,
-  shouldShowIntroduction,
-  onClose
-}) => {
-  if (!anchorRef.current || !shouldShowIntroduction) {
-    return null;
-  }
-  return /* @__PURE__ */ React20.createElement(
-    import_ui14.Popover,
-    {
-      anchorEl: anchorRef.current,
-      open: shouldShowIntroduction,
-      anchorOrigin: {
-        vertical: "top",
-        horizontal: "right"
-      },
-      transformOrigin: {
-        vertical: "top",
-        horizontal: -30
-      },
-      onClose
-    },
-    /* @__PURE__ */ React20.createElement(import_ui14.Box, { sx: { width: "296px" } }, /* @__PURE__ */ React20.createElement(import_editor_ui8.PopoverHeader, { title: (0, import_i18n11.__)("Add your first property", "elementor"), onClose }), /* @__PURE__ */ React20.createElement(
-      import_ui14.Image,
-      {
-        sx: { width: "296px", height: "160px" },
-        src: "https://assets.elementor.com/packages/v1/images/components-properties-intro.png",
-        alt: ""
-      }
-    ), /* @__PURE__ */ React20.createElement(import_editor_controls4.PopoverContent, null, /* @__PURE__ */ React20.createElement(import_ui14.Stack, { sx: { p: 2 } }, /* @__PURE__ */ React20.createElement(import_ui14.Typography, { variant: "body2" }, (0, import_i18n11.__)("Properties make instances flexible.", "elementor")), /* @__PURE__ */ React20.createElement(import_ui14.Typography, { variant: "body2" }, (0, import_i18n11.__)(
-      "Select any Element, then in the General tab, click next to any setting you want users to customize - like text, images, or links.",
-      "elementor"
-    )), /* @__PURE__ */ React20.createElement(import_ui14.Typography, { variant: "body2", sx: { mt: 2 } }, (0, import_i18n11.__)(
-      "Your properties will appear in the Properties panel, where you can organize and manage them anytime.",
-      "elementor"
-    )), /* @__PURE__ */ React20.createElement(
-      import_ui14.Link,
-      {
-        href: "http://go.elementor.com/components-guide",
-        target: "_blank",
-        sx: { mt: 2 },
-        color: "info.main",
-        variant: "body2"
-      },
-      (0, import_i18n11.__)("Learn more", "elementor")
-    ), /* @__PURE__ */ React20.createElement(import_ui14.Stack, { direction: "row", alignItems: "center", justifyContent: "flex-end", sx: { pt: 1 } }, /* @__PURE__ */ React20.createElement(import_ui14.Button, { size: "medium", variant: "contained", onClick: onClose }, (0, import_i18n11.__)("Got it", "elementor"))))))
-  );
+var COMPONENT_TYPE = "e-component";
+var COMPONENT_CIRCULAR_NESTING_ALERT = {
+  type: "default",
+  message: (0, import_i18n11.__)("Can't add this component - components that contain each other can't be nested.", "elementor"),
+  id: "circular-component-nesting-blocked"
 };
-
-// src/extended/components/component-properties-panel/component-properties-panel.tsx
-var React27 = __toESM(require("react"));
-var import_editor_editing_panel5 = require("@elementor/editor-editing-panel");
-var import_editor_panels4 = require("@elementor/editor-panels");
-var import_editor_ui12 = require("@elementor/editor-ui");
-var import_ui21 = require("@elementor/ui");
-var import_i18n20 = require("@wordpress/i18n");
-
-// src/extended/components/component-properties-panel/component-properties-panel-content.tsx
-var React26 = __toESM(require("react"));
-var import_react12 = require("react");
-var import_editor_documents7 = require("@elementor/editor-documents");
-var import_editor_panels3 = require("@elementor/editor-panels");
-var import_icons14 = require("@elementor/icons");
-var import_ui20 = require("@elementor/ui");
-var import_utils6 = require("@elementor/utils");
-var import_i18n19 = require("@wordpress/i18n");
-
-// src/extended/store/actions/add-overridable-group.ts
-function addOverridableGroup({
-  componentId,
-  groupId,
-  label,
-  source
-}) {
-  const currentComponent = componentsSelectors.getCurrentComponent();
-  const overridableProps = componentsSelectors.getOverridableProps(componentId);
-  if (!overridableProps) {
-    return;
-  }
-  const newGroup = {
-    id: groupId,
-    label,
-    props: []
-  };
-  componentsActions.setOverridableProps(componentId, {
-    ...overridableProps,
-    groups: {
-      ...overridableProps.groups,
-      items: {
-        ...overridableProps.groups.items,
-        [groupId]: newGroup
-      },
-      order: [groupId, ...overridableProps.groups.order]
-    }
+function initCircularNestingPrevention() {
+  (0, import_editor_v1_adapters4.blockCommand)({
+    command: "document/elements/create",
+    condition: blockCircularCreate
   });
-  trackComponentEvent({
-    action: "propertiesGroupCreated",
-    source,
-    component_uid: currentComponent?.uid,
-    group_name: label
+  (0, import_editor_v1_adapters4.blockCommand)({
+    command: "document/elements/move",
+    condition: blockCircularMove
+  });
+  (0, import_editor_v1_adapters4.blockCommand)({
+    command: "document/elements/paste",
+    condition: blockCircularPaste
   });
-  return newGroup;
-}
-
-// src/extended/store/utils/groups-transformers.ts
-var import_utils5 = require("@elementor/utils");
-var import_i18n12 = require("@wordpress/i18n");
-function removePropFromAllGroups(groups, propKey) {
-  const propKeys = Array.isArray(propKey) ? propKey : [propKey];
-  return {
-    ...groups,
-    items: Object.fromEntries(
-      Object.entries(groups.items).map(([groupId, group]) => [
-        groupId,
-        {
-          ...group,
-          props: group.props.filter((p) => !propKeys.includes(p))
-        }
-      ])
-    )
-  };
 }
-function addPropToGroup(groups, groupId, propKey) {
-  const group = groups.items[groupId];
-  if (!group) {
-    return groups;
-  }
-  if (group.props.includes(propKey)) {
-    return groups;
+function wouldCreateCircularNesting(componentIdToAdd) {
+  if (componentIdToAdd === void 0) {
+    return false;
   }
-  return {
-    ...groups,
-    items: {
-      ...groups.items,
-      [groupId]: {
-        ...group,
-        props: [...group.props, propKey]
-      }
-    }
-  };
-}
-function movePropBetweenGroups(groups, propKey, fromGroupId, toGroupId) {
-  if (fromGroupId === toGroupId) {
-    return groups;
+  const state = (0, import_store29.__getState)();
+  const currentComponentId = selectCurrentComponentId(state);
+  const path = selectPath(state);
+  if (currentComponentId === null) {
+    return false;
   }
-  const withoutProp = removePropFromGroup(groups, fromGroupId, propKey);
-  return addPropToGroup(withoutProp, toGroupId, propKey);
-}
-function removePropFromGroup(groups, groupId, propKey) {
-  const group = groups.items[groupId];
-  if (!group) {
-    return groups;
+  if (componentIdToAdd === currentComponentId) {
+    return true;
   }
-  return {
-    ...groups,
-    items: {
-      ...groups.items,
-      [groupId]: {
-        ...group,
-        props: group.props.filter((p) => p !== propKey)
-      }
-    }
-  };
+  return path.some((item) => item.componentId === componentIdToAdd);
 }
-function resolveOrCreateGroup(groups, requestedGroupId) {
-  if (requestedGroupId && groups.items[requestedGroupId]) {
-    return { groups, groupId: requestedGroupId };
+function extractComponentIdFromModel(model) {
+  if (!model) {
+    return null;
   }
-  if (!requestedGroupId && groups.order.length > 0) {
-    return { groups, groupId: groups.order[0] };
+  const isComponent = model.widgetType === COMPONENT_TYPE;
+  if (!isComponent) {
+    return null;
   }
-  return createGroup(groups, requestedGroupId);
+  return model.settings?.component_instance?.value?.component_id?.value ?? null;
 }
-function createGroup(groups, groupId, label) {
-  const newGroupId = groupId || (0, import_utils5.generateUniqueId)("group");
-  const newLabel = label || (0, import_i18n12.__)("Default", "elementor");
-  return {
-    groups: {
-      ...groups,
-      items: {
-        ...groups.items,
-        [newGroupId]: {
-          id: newGroupId,
-          label: newLabel,
-          props: []
-        }
-      },
-      order: [...groups.order, newGroupId]
-    },
-    groupId: newGroupId
-  };
+function extractComponentIdFromElement(element) {
+  if (element.widgetType !== COMPONENT_TYPE) {
+    return null;
+  }
+  return element.settings?.component_instance?.value?.component_id?.value ?? null;
 }
-function removePropsFromState(overridableProps, propsToRemove) {
-  const overrideKeysToRemove = propsToRemove.map((prop) => prop.overrideKey);
-  const remainingProps = Object.fromEntries(
-    Object.entries(overridableProps.props).filter(([, prop]) => !propsToRemove.includes(prop))
-  );
-  const updatedGroupItems = Object.fromEntries(
-    Object.entries(overridableProps.groups.items).map(
-      ([groupId, group]) => [
-        groupId,
-        {
-          ...group,
-          props: group.props.filter((prop) => !overrideKeysToRemove.includes(prop))
-        }
-      ]
-    )
-  );
-  return {
-    props: remainingProps,
-    groups: {
-      items: updatedGroupItems,
-      order: overridableProps.groups.order.filter((groupId) => !overrideKeysToRemove.includes(groupId))
+function extractComponentIdsFromElements(elements) {
+  const ids = [];
+  for (const element of elements) {
+    const componentId = extractComponentIdFromElement(element);
+    if (componentId !== null) {
+      ids.push(componentId);
+    }
+    if (element.elements?.length) {
+      ids.push(...extractComponentIdsFromElements(element.elements));
     }
-  };
-}
-function ensureGroupInOrder(groups, groupId) {
-  if (groups.order.includes(groupId)) {
-    return groups;
   }
-  return {
-    ...groups,
-    order: [...groups.order, groupId]
-  };
-}
-function deleteGroup(groups, groupId) {
-  const { [groupId]: removed, ...remainingItems } = groups.items;
-  return {
-    items: remainingItems,
-    order: groups.order.filter((id2) => id2 !== groupId)
-  };
+  return ids;
 }
-function renameGroup(groups, groupId, newLabel) {
-  const group = groups.items[groupId];
-  if (!group) {
-    return groups;
+function extractComponentIdFromContainer(container) {
+  const widgetType = container.model?.get?.("widgetType");
+  if (widgetType !== COMPONENT_TYPE) {
+    return null;
   }
-  return {
-    ...groups,
-    items: {
-      ...groups.items,
-      [groupId]: {
-        ...group,
-        label: newLabel
-      }
-    }
-  };
+  const settings = container.model?.get?.("settings");
+  const componentInstance = settings?.get?.("component_instance");
+  return componentInstance?.value?.component_id?.value ?? null;
 }
-
-// src/extended/store/actions/delete-overridable-group.ts
-function deleteOverridableGroup({ componentId, groupId }) {
-  const overridableProps = componentsSelectors.getOverridableProps(componentId);
-  if (!overridableProps) {
+function blockCircularCreate(args) {
+  const componentId = extractComponentIdFromModel(args.model);
+  if (componentId === null) {
     return false;
   }
-  const group = overridableProps.groups.items[groupId];
-  if (!group || group.props.length > 0) {
-    return false;
+  const isBlocked = wouldCreateCircularNesting(componentId);
+  if (isBlocked) {
+    (0, import_editor_notifications3.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
   }
-  const updatedGroups = deleteGroup(overridableProps.groups, groupId);
-  componentsActions.setOverridableProps(componentId, {
-    ...overridableProps,
-    groups: updatedGroups
-  });
-  return true;
+  return isBlocked;
 }
-
-// src/extended/utils/revert-overridable-settings.ts
-var import_editor_elements9 = require("@elementor/editor-elements");
-function revertElementOverridableSetting(elementId, settingKey, originValue, overrideKey) {
-  const container = (0, import_editor_elements9.getContainer)(elementId);
-  if (!container) {
-    return;
-  }
-  if (isComponentInstance(container.model.toJSON())) {
-    revertComponentInstanceOverridableSetting(elementId, overrideKey);
-    return;
-  }
-  (0, import_editor_elements9.updateElementSettings)({
-    id: elementId,
-    props: { [settingKey]: originValue ?? null },
-    withHistory: false
+function blockCircularMove(args) {
+  const { containers = [args.container] } = args;
+  const hasCircularComponent = containers.some((container) => {
+    if (!container) {
+      return false;
+    }
+    const allElements = (0, import_editor_elements9.getAllDescendants)(container);
+    return allElements.some((element) => {
+      const componentId = extractComponentIdFromContainer(element);
+      if (componentId === null) {
+        return false;
+      }
+      return wouldCreateCircularNesting(componentId);
+    });
   });
-}
-function revertComponentInstanceOverridableSetting(elementId, overrideKey) {
-  const setting = (0, import_editor_elements9.getElementSetting)(elementId, "component_instance");
-  const componentInstance = componentInstancePropTypeUtil.extract(setting);
-  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
-  if (!overrides?.length) {
-    return;
+  if (hasCircularComponent) {
+    (0, import_editor_notifications3.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
   }
-  const revertedOverrides = revertComponentInstanceOverrides(overrides, overrideKey);
-  const updatedSetting = componentInstancePropTypeUtil.create({
-    ...componentInstance,
-    overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
-  });
-  (0, import_editor_elements9.updateElementSettings)({
-    id: elementId,
-    props: { component_instance: updatedSetting },
-    withHistory: false
-  });
-}
-function revertComponentInstanceOverrides(overrides, filterByKey) {
-  return overrides.map((item) => {
-    if (!componentOverridablePropTypeUtil.isValid(item)) {
-      return item;
-    }
-    if (!componentInstanceOverridePropTypeUtil.isValid(item.value.origin_value)) {
-      return null;
-    }
-    if (filterByKey && item.value.override_key !== filterByKey) {
-      return item;
-    }
-    return item.value.origin_value;
-  }).filter((item) => item !== null);
+  return hasCircularComponent;
 }
-function revertOverridablePropsFromSettings(settings) {
-  let hasChanges = false;
-  const revertedSettings = {};
-  for (const [key, value] of Object.entries(settings)) {
-    if (componentOverridablePropTypeUtil.isValid(value)) {
-      revertedSettings[key] = value.value.origin_value;
-      hasChanges = true;
-    } else {
-      revertedSettings[key] = value;
-    }
+function blockCircularPaste(args) {
+  const { storageType } = args;
+  if (storageType !== "localstorage") {
+    return false;
   }
-  return { hasChanges, settings: revertedSettings };
-}
-function revertAllOverridablesInElementData(elementData) {
-  const revertedElement = { ...elementData };
-  if (isComponentInstance({ widgetType: elementData.widgetType, elType: elementData.elType })) {
-    revertedElement.settings = revertComponentInstanceSettings(elementData.settings);
-  } else if (revertedElement.settings) {
-    const { settings } = revertOverridablePropsFromSettings(revertedElement.settings);
-    revertedElement.settings = settings;
+  const data = window?.elementorCommon?.storage?.get();
+  if (!data?.clipboard?.elements) {
+    return false;
   }
-  if (revertedElement.elements) {
-    revertedElement.elements = revertedElement.elements.map(revertAllOverridablesInElementData);
+  const allComponentIds = extractComponentIdsFromElements(data.clipboard.elements);
+  const hasCircularComponent = allComponentIds.some(wouldCreateCircularNesting);
+  if (hasCircularComponent) {
+    (0, import_editor_notifications3.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
   }
-  return revertedElement;
+  return hasCircularComponent;
 }
-function revertComponentInstanceSettings(settings) {
-  if (!settings?.component_instance) {
-    return settings;
-  }
-  const componentInstance = componentInstancePropTypeUtil.extract(settings.component_instance);
-  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
-  if (!overrides?.length) {
-    return settings;
-  }
-  const revertedOverrides = revertComponentInstanceOverrides(overrides);
-  return {
-    ...settings,
-    component_instance: componentInstancePropTypeUtil.create({
-      ...componentInstance,
-      overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
-    })
-  };
+
+// src/store/actions/remove-component-styles.ts
+var import_store31 = require("@elementor/store");
+function removeComponentStyles(id) {
+  apiClient.invalidateComponentConfigCache(id);
+  (0, import_store31.__dispatch)(slice.actions.removeStyles({ id }));
 }
-function revertAllOverridablesInContainer(container) {
-  (0, import_editor_elements9.getAllDescendants)(container).forEach((element) => {
-    if (element.model.get("widgetType") === COMPONENT_WIDGET_TYPE2) {
-      revertComponentInstanceOverridesInElement(element);
-    } else {
-      revertElementSettings(element);
+
+// src/store/components-styles-provider.ts
+var import_editor_styles_repository = require("@elementor/editor-styles-repository");
+var import_store33 = require("@elementor/store");
+var componentsStylesProvider = (0, import_editor_styles_repository.createStylesProvider)({
+  key: "components-styles",
+  priority: 100,
+  subscribe: (cb) => (0, import_store33.__subscribeWithSelector)(
+    (state) => state[SLICE_NAME],
+    () => {
+      cb();
+    }
+  ),
+  actions: {
+    all: () => {
+      return selectFlatStyles((0, import_store33.__getState)());
+    },
+    get: (id) => {
+      return selectFlatStyles((0, import_store33.__getState)()).find((style) => style.id === id) ?? null;
     }
-  });
-}
-function revertComponentInstanceOverridesInElement(element) {
-  const settings = element.settings?.toJSON() ?? {};
-  const componentInstance = componentInstancePropTypeUtil.extract(settings.component_instance);
-  const overrides = componentInstanceOverridesPropTypeUtil.extract(componentInstance?.overrides);
-  if (!overrides?.length) {
-    return;
-  }
-  const revertedOverrides = revertComponentInstanceOverrides(overrides);
-  const updatedSetting = componentInstancePropTypeUtil.create({
-    ...componentInstance,
-    overrides: componentInstanceOverridesPropTypeUtil.create(revertedOverrides)
-  });
-  (0, import_editor_elements9.updateElementSettings)({
-    id: element.id,
-    props: { component_instance: updatedSetting },
-    withHistory: false
-  });
-}
-function revertElementSettings(element) {
-  const settings = element.settings?.toJSON() ?? {};
-  const { hasChanges, settings: revertedSettings } = revertOverridablePropsFromSettings(settings);
-  if (!hasChanges) {
-    return;
   }
-  (0, import_editor_elements9.updateElementSettings)({
-    id: element.id,
-    props: revertedSettings,
-    withHistory: false
-  });
-}
+});
 
-// src/extended/store/actions/delete-overridable-prop.ts
-function deleteOverridableProp({ componentId, propKey, source }) {
-  const overridableProps = componentsSelectors.getOverridableProps(componentId);
-  if (!overridableProps || Object.keys(overridableProps.props).length === 0) {
+// src/sync/publish-draft-components-in-page-before-save.ts
+var import_editor_documents5 = require("@elementor/editor-documents");
+async function publishDraftComponentsInPageBeforeSave({ status, elements }) {
+  if (status !== "publish") {
     return;
   }
-  const propKeysToDelete = Array.isArray(propKey) ? propKey : [propKey];
-  const deletedProps = [];
-  for (const key of propKeysToDelete) {
-    const prop = overridableProps.props[key];
-    if (!prop) {
-      continue;
-    }
-    deletedProps.push(prop);
-    revertElementOverridableSetting(prop.elementId, prop.propKey, prop.originValue, key);
-  }
-  if (deletedProps.length === 0) {
+  const documents = await getComponentDocuments(elements);
+  const draftIds = [...documents.values()].filter(import_editor_documents5.isDocumentDirty).map((document) => document.id);
+  if (draftIds.length === 0) {
     return;
   }
-  const remainingProps = Object.fromEntries(
-    Object.entries(overridableProps.props).filter(([key]) => !propKeysToDelete.includes(key))
-  );
-  const updatedGroups = removePropFromAllGroups(overridableProps.groups, propKey);
-  componentsActions.setOverridableProps(componentId, {
-    ...overridableProps,
-    props: remainingProps,
-    groups: updatedGroups
-  });
-  const currentComponent = componentsSelectors.getCurrentComponent();
-  for (const prop of deletedProps) {
-    trackComponentEvent({
-      action: "propertyRemoved",
-      source,
-      component_uid: currentComponent?.uid,
-      property_id: prop.overrideKey,
-      property_path: prop.propKey,
-      property_name: prop.label,
-      element_type: prop.widgetType ?? prop.elType
-    });
-  }
+  await apiClient.updateStatuses(draftIds, "publish");
+  draftIds.forEach((id) => (0, import_editor_documents5.invalidateDocumentData)(id));
 }
 
-// src/extended/store/actions/reorder-group-props.ts
-function reorderGroupProps({ componentId, groupId, newPropsOrder }) {
-  const overridableProps = componentsSelectors.getOverridableProps(componentId);
-  if (!overridableProps) {
-    return;
-  }
-  const group = overridableProps.groups.items[groupId];
-  if (!group) {
-    return;
-  }
-  componentsActions.setOverridableProps(componentId, {
-    ...overridableProps,
-    groups: {
-      ...overridableProps.groups,
-      items: {
-        ...overridableProps.groups.items,
-        [groupId]: {
-          ...group,
-          props: newPropsOrder
-        }
-      }
-    }
-  });
-}
-
-// src/extended/store/actions/reorder-overridable-groups.ts
-function reorderOverridableGroups({ componentId, newOrder }) {
-  const overridableProps = componentsSelectors.getOverridableProps(componentId);
-  if (!overridableProps) {
-    return;
-  }
-  componentsActions.setOverridableProps(componentId, {
-    ...overridableProps,
-    groups: {
-      ...overridableProps.groups,
-      order: newOrder
-    }
-  });
-}
-
-// src/extended/store/actions/update-overridable-prop-params.ts
-function updateOverridablePropParams({
-  componentId,
-  overrideKey,
-  label,
-  groupId
-}) {
-  const overridableProps = componentsSelectors.getOverridableProps(componentId);
-  if (!overridableProps) {
-    return;
-  }
-  const prop = overridableProps.props[overrideKey];
-  if (!prop) {
-    return;
-  }
-  const oldGroupId = prop.groupId;
-  const newGroupId = groupId ?? oldGroupId;
-  const updatedProp = {
-    ...prop,
-    label,
-    groupId: newGroupId
-  };
-  const updatedGroups = movePropBetweenGroups(overridableProps.groups, overrideKey, oldGroupId, newGroupId);
-  componentsActions.setOverridableProps(componentId, {
-    ...overridableProps,
-    props: {
-      ...overridableProps.props,
-      [overrideKey]: updatedProp
-    },
-    groups: updatedGroups
-  });
-  return updatedProp;
-}
-
-// src/extended/components/component-properties-panel/properties-empty-state.tsx
-var React21 = __toESM(require("react"));
-var import_react9 = require("react");
-var import_icons10 = require("@elementor/icons");
-var import_ui15 = require("@elementor/ui");
-var import_i18n13 = require("@wordpress/i18n");
-function PropertiesEmptyState({ introductionRef }) {
-  const [isOpen, setIsOpen] = (0, import_react9.useState)(false);
-  return /* @__PURE__ */ React21.createElement(React21.Fragment, null, /* @__PURE__ */ React21.createElement(
-    import_ui15.Stack,
-    {
-      alignItems: "center",
-      justifyContent: "flex-start",
-      height: "100%",
-      color: "text.secondary",
-      sx: { px: 2.5, pt: 10, pb: 5.5 },
-      gap: 1
-    },
-    /* @__PURE__ */ React21.createElement(import_icons10.ComponentPropListIcon, { fontSize: "large" }),
-    /* @__PURE__ */ React21.createElement(import_ui15.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n13.__)("Add your first property", "elementor")),
-    /* @__PURE__ */ React21.createElement(import_ui15.Typography, { align: "center", variant: "caption" }, (0, import_i18n13.__)("Make instances flexible while keeping design synced.", "elementor")),
-    /* @__PURE__ */ React21.createElement(import_ui15.Typography, { align: "center", variant: "caption" }, (0, import_i18n13.__)("Select any element, then click + next to a setting to expose it.", "elementor")),
-    /* @__PURE__ */ React21.createElement(
-      import_ui15.Link,
-      {
-        variant: "caption",
-        color: "secondary",
-        sx: { textDecorationLine: "underline" },
-        onClick: () => setIsOpen(true)
-      },
-      (0, import_i18n13.__)("Learn more", "elementor")
-    )
-  ), /* @__PURE__ */ React21.createElement(
-    ComponentIntroduction,
-    {
-      anchorRef: introductionRef,
-      shouldShowIntroduction: isOpen,
-      onClose: () => setIsOpen(false)
-    }
-  ));
-}
-
-// src/extended/components/component-properties-panel/properties-group.tsx
-var React25 = __toESM(require("react"));
-var import_editor_ui10 = require("@elementor/editor-ui");
-var import_icons13 = require("@elementor/icons");
-var import_ui19 = require("@elementor/ui");
-var import_i18n16 = require("@wordpress/i18n");
-
-// src/extended/components/component-properties-panel/property-item.tsx
-var React24 = __toESM(require("react"));
-var import_editor_elements10 = require("@elementor/editor-elements");
-var import_icons12 = require("@elementor/icons");
-var import_ui18 = require("@elementor/ui");
-
-// src/extended/components/overridable-props/overridable-prop-form.tsx
-var React22 = __toESM(require("react"));
-var import_react10 = require("react");
-var import_editor_ui9 = require("@elementor/editor-ui");
-var import_ui16 = require("@elementor/ui");
-var import_i18n15 = require("@wordpress/i18n");
-
-// src/extended/components/overridable-props/utils/validate-prop-label.ts
-var import_i18n14 = require("@wordpress/i18n");
-var ERROR_MESSAGES = {
-  EMPTY_NAME: (0, import_i18n14.__)("Property name is required", "elementor"),
-  DUPLICATE_NAME: (0, import_i18n14.__)("Property name already exists", "elementor")
-};
-function validatePropLabel(label, existingLabels, currentLabel) {
-  const trimmedLabel = label.trim();
-  if (!trimmedLabel) {
-    return { isValid: false, errorMessage: ERROR_MESSAGES.EMPTY_NAME };
-  }
-  const normalizedLabel = trimmedLabel.toLowerCase();
-  const normalizedCurrentLabel = currentLabel?.trim().toLowerCase();
-  const isDuplicate = existingLabels.some((existingLabel) => {
-    const normalizedExisting = existingLabel.trim().toLowerCase();
-    if (normalizedCurrentLabel && normalizedExisting === normalizedCurrentLabel) {
-      return false;
-    }
-    return normalizedExisting === normalizedLabel;
-  });
-  if (isDuplicate) {
-    return { isValid: false, errorMessage: ERROR_MESSAGES.DUPLICATE_NAME };
-  }
-  return { isValid: true, errorMessage: null };
-}
-
-// src/extended/components/overridable-props/overridable-prop-form.tsx
-var SIZE = "tiny";
-var DEFAULT_GROUP = { value: null, label: (0, import_i18n15.__)("Default", "elementor") };
-function OverridablePropForm({ onSubmit, groups, currentValue, existingLabels = [], sx }) {
-  const selectGroups = groups?.length ? groups : [DEFAULT_GROUP];
-  const [propLabel, setPropLabel] = (0, import_react10.useState)(currentValue?.label ?? null);
-  const [group, setGroup] = (0, import_react10.useState)(currentValue?.groupId ?? selectGroups[0]?.value ?? null);
-  const [error, setError] = (0, import_react10.useState)(null);
-  const name = (0, import_i18n15.__)("Name", "elementor");
-  const groupName = (0, import_i18n15.__)("Group Name", "elementor");
-  const isCreate = currentValue === void 0;
-  const title = isCreate ? (0, import_i18n15.__)("Create new property", "elementor") : (0, import_i18n15.__)("Update property", "elementor");
-  const ctaLabel = isCreate ? (0, import_i18n15.__)("Create", "elementor") : (0, import_i18n15.__)("Update", "elementor");
-  const handleSubmit = () => {
-    const validationResult = validatePropLabel(propLabel ?? "", existingLabels, currentValue?.label);
-    if (!validationResult.isValid) {
-      setError(validationResult.errorMessage);
-      return;
-    }
-    onSubmit({ label: propLabel ?? "", group });
-  };
-  return /* @__PURE__ */ React22.createElement(import_editor_ui9.Form, { onSubmit: handleSubmit, "data-testid": "overridable-prop-form" }, /* @__PURE__ */ React22.createElement(import_ui16.Stack, { alignItems: "start", sx: { width: "268px", ...sx } }, /* @__PURE__ */ React22.createElement(
-    import_ui16.Stack,
-    {
-      direction: "row",
-      alignItems: "center",
-      py: 1,
-      px: 1.5,
-      sx: { columnGap: 0.5, borderBottom: "1px solid", borderColor: "divider", width: "100%", mb: 1.5 }
-    },
-    /* @__PURE__ */ React22.createElement(import_ui16.Typography, { variant: "caption", sx: { color: "text.primary", fontWeight: "500", lineHeight: 1 } }, title)
-  ), /* @__PURE__ */ React22.createElement(import_ui16.Grid, { container: true, gap: 0.75, alignItems: "start", px: 1.5, mb: 1.5 }, /* @__PURE__ */ React22.createElement(import_ui16.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React22.createElement(import_ui16.FormLabel, { size: "tiny" }, name)), /* @__PURE__ */ React22.createElement(import_ui16.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React22.createElement(
-    import_ui16.TextField,
-    {
-      name,
-      size: SIZE,
-      fullWidth: true,
-      placeholder: (0, import_i18n15.__)("Enter value", "elementor"),
-      value: propLabel ?? "",
-      onChange: (e) => {
-        const newValue = e.target.value;
-        setPropLabel(newValue);
-        const validationResult = validatePropLabel(
-          newValue,
-          existingLabels,
-          currentValue?.label
-        );
-        setError(validationResult.errorMessage);
-      },
-      error: Boolean(error),
-      helperText: error
-    }
-  ))), /* @__PURE__ */ React22.createElement(import_ui16.Grid, { container: true, gap: 0.75, alignItems: "start", px: 1.5, mb: 1.5 }, /* @__PURE__ */ React22.createElement(import_ui16.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React22.createElement(import_ui16.FormLabel, { size: "tiny" }, groupName)), /* @__PURE__ */ React22.createElement(import_ui16.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React22.createElement(
-    import_ui16.Select,
-    {
-      name: groupName,
-      size: SIZE,
-      fullWidth: true,
-      value: group ?? null,
-      onChange: (e) => setGroup(e.target.value),
-      displayEmpty: true,
-      renderValue: (selectedValue) => {
-        if (!selectedValue) {
-          return selectGroups[0].label;
-        }
-        return selectGroups.find(({ value }) => value === selectedValue)?.label ?? selectedValue;
-      }
-    },
-    selectGroups.map(({ label: groupLabel, ...props }) => /* @__PURE__ */ React22.createElement(import_editor_ui9.MenuListItem, { key: props.value, ...props, value: props.value ?? "" }, groupLabel))
-  ))), /* @__PURE__ */ React22.createElement(import_ui16.Stack, { direction: "row", justifyContent: "flex-end", alignSelf: "end", mt: 1.5, py: 1, px: 1.5 }, /* @__PURE__ */ React22.createElement(
-    import_ui16.Button,
-    {
-      type: "submit",
-      disabled: !propLabel || Boolean(error),
-      variant: "contained",
-      color: "primary",
-      size: "small"
-    },
-    ctaLabel
-  ))));
-}
-
-// src/extended/components/component-properties-panel/sortable.tsx
-var React23 = __toESM(require("react"));
-var import_icons11 = require("@elementor/icons");
-var import_ui17 = require("@elementor/ui");
-var SortableProvider = (props) => /* @__PURE__ */ React23.createElement(import_ui17.UnstableSortableProvider, { restrictAxis: true, variant: "static", dragPlaceholderStyle: { opacity: "1" }, ...props });
-var SortableTrigger = ({ triggerClassName, ...props }) => /* @__PURE__ */ React23.createElement(
-  StyledSortableTrigger,
-  {
-    ...props,
-    role: "button",
-    className: `sortable-trigger ${triggerClassName ?? ""}`.trim(),
-    "aria-label": "sort"
-  },
-  /* @__PURE__ */ React23.createElement(import_icons11.GripVerticalIcon, { fontSize: "tiny" })
-);
-var SortableItem = ({ children, id: id2 }) => /* @__PURE__ */ React23.createElement(
-  import_ui17.UnstableSortableItem,
-  {
-    id: id2,
-    render: ({
-      itemProps,
-      isDragged,
-      triggerProps,
-      itemStyle,
-      triggerStyle,
-      dropIndicationStyle,
-      showDropIndication,
-      isDragOverlay,
-      isDragPlaceholder
-    }) => /* @__PURE__ */ React23.createElement(
-      import_ui17.Box,
-      {
-        ...itemProps,
-        style: itemStyle,
-        component: "div",
-        role: "listitem",
-        sx: {
-          backgroundColor: isDragOverlay ? "background.paper" : void 0
-        }
-      },
-      children({
-        isDragged,
-        isDragPlaceholder,
-        triggerProps,
-        triggerStyle
-      }),
-      showDropIndication && /* @__PURE__ */ React23.createElement(SortableItemIndicator, { style: dropIndicationStyle })
-    )
-  }
-);
-var StyledSortableTrigger = (0, import_ui17.styled)("div")(({ theme }) => ({
-  position: "absolute",
-  left: "-2px",
-  top: "50%",
-  transform: `translate( -${theme.spacing(1.5)}, -50% )`,
-  color: theme.palette.action.active,
-  cursor: "grab"
-}));
-var SortableItemIndicator = (0, import_ui17.styled)(import_ui17.Box)`
-	width: 100%;
-	height: 1px;
-	background-color: ${({ theme }) => theme.palette.text.primary};
-`;
-
-// src/extended/components/component-properties-panel/property-item.tsx
-function PropertyItem({
-  prop,
-  sortableTriggerProps,
-  isDragPlaceholder,
-  groups,
-  existingLabels,
-  onDelete,
-  onUpdate
-}) {
-  const popoverState = (0, import_ui18.usePopupState)({
-    variant: "popover"
-  });
-  const icon = getElementIcon(prop);
-  const popoverProps = (0, import_ui18.bindPopover)(popoverState);
-  const handleSubmit = (data) => {
-    onUpdate(data);
-    popoverState.close();
-  };
-  const handleDelete = (event) => {
-    event.stopPropagation();
-    onDelete(prop.overrideKey);
-  };
-  return /* @__PURE__ */ React24.createElement(React24.Fragment, null, /* @__PURE__ */ React24.createElement(
-    import_ui18.Box,
-    {
-      ...(0, import_ui18.bindTrigger)(popoverState),
-      sx: {
-        position: "relative",
-        pl: 0.5,
-        pr: 1,
-        py: 0.25,
-        minHeight: 28,
-        borderRadius: 1,
-        border: "1px solid",
-        borderColor: "divider",
-        display: "flex",
-        alignItems: "center",
-        gap: 0.5,
-        opacity: isDragPlaceholder ? 0.5 : 1,
-        cursor: "pointer",
-        "&:hover": {
-          backgroundColor: "action.hover"
-        },
-        "&:hover .sortable-trigger": {
-          visibility: "visible"
-        },
-        "& .sortable-trigger": {
-          visibility: "hidden"
-        },
-        "&:hover .delete-button": {
-          visibility: "visible"
-        },
-        "& .delete-button": {
-          visibility: "hidden"
-        }
-      }
-    },
-    /* @__PURE__ */ React24.createElement(SortableTrigger, { ...sortableTriggerProps }),
-    /* @__PURE__ */ React24.createElement(
-      import_ui18.Box,
-      {
-        sx: { display: "flex", alignItems: "center", color: "text.primary", fontSize: 12, padding: 0.25 }
-      },
-      /* @__PURE__ */ React24.createElement("i", { className: icon })
-    ),
-    /* @__PURE__ */ React24.createElement(import_ui18.Typography, { variant: "caption", sx: { color: "text.primary", flexGrow: 1, fontSize: 10 } }, prop.label),
-    /* @__PURE__ */ React24.createElement(import_ui18.IconButton, { size: "tiny", onClick: handleDelete, "aria-label": "Delete property", sx: { p: 0.25 } }, /* @__PURE__ */ React24.createElement(import_icons12.XIcon, { fontSize: "tiny" }))
-  ), /* @__PURE__ */ React24.createElement(
-    import_ui18.Popover,
-    {
-      ...popoverProps,
-      anchorOrigin: { vertical: "bottom", horizontal: "left" },
-      transformOrigin: { vertical: "top", horizontal: "left" },
-      PaperProps: { sx: { width: popoverState.anchorEl?.getBoundingClientRect().width } }
-    },
-    /* @__PURE__ */ React24.createElement(
-      OverridablePropForm,
-      {
-        onSubmit: handleSubmit,
-        currentValue: prop,
-        groups,
-        existingLabels,
-        sx: { width: "100%" }
-      }
-    )
-  ));
-}
-function getElementIcon(prop) {
-  const elType = prop.elType === "widget" ? prop.widgetType : prop.elType;
-  const widgetsCache = (0, import_editor_elements10.getWidgetsCache)();
-  if (!widgetsCache) {
-    return "eicon-apps";
-  }
-  const widgetConfig = widgetsCache[elType];
-  return widgetConfig?.icon || "eicon-apps";
-}
-
-// src/extended/components/component-properties-panel/properties-group.tsx
-function PropertiesGroup({
-  group,
-  props,
-  allGroups,
-  sortableTriggerProps,
-  isDragPlaceholder,
-  onPropsReorder,
-  onPropertyDelete,
-  onPropertyUpdate,
-  onGroupDelete,
-  editableLabelProps
-}) {
-  const groupProps = group.props.map((propId) => props[propId]).filter((prop) => Boolean(prop));
-  const popupState = (0, import_ui19.usePopupState)({
-    variant: "popover",
-    disableAutoFocus: true
-  });
-  const { editableRef, isEditing, error, getEditableProps, setEditingGroupId, editingGroupId } = editableLabelProps;
-  const hasProperties = group.props.length > 0;
-  const isThisGroupEditing = isEditing && editingGroupId === group.id;
-  const handleRenameClick = () => {
-    popupState.close();
-    setEditingGroupId(group.id);
-  };
-  const handleDeleteClick = () => {
-    popupState.close();
-    onGroupDelete(group.id);
-  };
-  return /* @__PURE__ */ React25.createElement(
-    import_ui19.Box,
-    {
-      sx: {
-        opacity: isDragPlaceholder ? 0.5 : 1
-      }
-    },
-    /* @__PURE__ */ React25.createElement(import_ui19.Stack, { gap: 1 }, /* @__PURE__ */ React25.createElement(
-      import_ui19.Box,
-      {
-        className: "group-header",
-        sx: {
-          position: "relative",
-          "&:hover .group-sortable-trigger": {
-            visibility: "visible"
-          },
-          "& .group-sortable-trigger": {
-            visibility: "hidden"
-          },
-          "&:hover .group-menu": {
-            visibility: "visible"
-          },
-          "& .group-menu": {
-            visibility: "hidden"
-          }
-        }
-      },
-      /* @__PURE__ */ React25.createElement(SortableTrigger, { triggerClassName: "group-sortable-trigger", ...sortableTriggerProps }),
-      /* @__PURE__ */ React25.createElement(import_ui19.Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", gap: 2 }, isThisGroupEditing ? /* @__PURE__ */ React25.createElement(
-        import_ui19.Box,
-        {
-          sx: {
-            height: 28,
-            display: "flex",
-            alignItems: "center",
-            border: 2,
-            borderColor: "text.secondary",
-            borderRadius: 1,
-            pl: 0.5,
-            flexGrow: 1,
-            overflow: "hidden",
-            textOverflow: "ellipsis",
-            whiteSpace: "nowrap",
-            width: "100%"
-          }
-        },
-        /* @__PURE__ */ React25.createElement(
-          import_editor_ui10.EditableField,
-          {
-            ref: editableRef,
-            as: import_ui19.Typography,
-            variant: "caption",
-            error: error ?? void 0,
-            sx: { color: "text.primary", fontWeight: 400, lineHeight: 1.66 },
-            ...getEditableProps()
-          }
-        )
-      ) : /* @__PURE__ */ React25.createElement(
-        import_editor_ui10.EllipsisWithTooltip,
-        {
-          title: group.label,
-          as: import_ui19.Typography,
-          variant: "caption",
-          sx: { color: "text.primary", fontWeight: 400, lineHeight: 1.66 }
-        }
-      ), /* @__PURE__ */ React25.createElement(
-        import_ui19.IconButton,
-        {
-          className: "group-menu",
-          size: "tiny",
-          sx: { p: 0.25, visibility: isThisGroupEditing ? "visible" : void 0 },
-          "aria-label": (0, import_i18n16.__)("Group actions", "elementor"),
-          ...(0, import_ui19.bindTrigger)(popupState)
-        },
-        /* @__PURE__ */ React25.createElement(import_icons13.DotsVerticalIcon, { fontSize: "tiny" })
-      ))
-    ), /* @__PURE__ */ React25.createElement(import_ui19.List, { sx: { p: 0, display: "flex", flexDirection: "column", gap: 1 } }, /* @__PURE__ */ React25.createElement(SortableProvider, { value: group.props, onChange: onPropsReorder }, groupProps.map((prop) => /* @__PURE__ */ React25.createElement(SortableItem, { key: prop.overrideKey, id: prop.overrideKey }, ({ triggerProps, triggerStyle, isDragPlaceholder: isItemDragPlaceholder }) => /* @__PURE__ */ React25.createElement(
-      PropertyItem,
-      {
-        prop,
-        sortableTriggerProps: { ...triggerProps, style: triggerStyle },
-        isDragPlaceholder: isItemDragPlaceholder,
-        groups: allGroups,
-        existingLabels: Object.values(props).map((p) => p.label),
-        onDelete: onPropertyDelete,
-        onUpdate: (data) => onPropertyUpdate(prop.overrideKey, data)
-      }
-    )))))),
-    /* @__PURE__ */ React25.createElement(
-      import_ui19.Menu,
-      {
-        ...(0, import_ui19.bindMenu)(popupState),
-        anchorOrigin: { vertical: "bottom", horizontal: "right" },
-        transformOrigin: { vertical: "top", horizontal: "right" }
-      },
-      /* @__PURE__ */ React25.createElement(import_editor_ui10.MenuListItem, { sx: { minWidth: "160px" }, onClick: handleRenameClick }, /* @__PURE__ */ React25.createElement(import_ui19.Typography, { variant: "caption", sx: { color: "text.primary" } }, (0, import_i18n16.__)("Rename", "elementor"))),
-      /* @__PURE__ */ React25.createElement(
-        import_ui19.Tooltip,
-        {
-          title: hasProperties ? (0, import_i18n16.__)("To delete the group, first remove all the properties", "elementor") : "",
-          placement: "right"
-        },
-        /* @__PURE__ */ React25.createElement("span", null, /* @__PURE__ */ React25.createElement(import_editor_ui10.MenuListItem, { onClick: handleDeleteClick, disabled: hasProperties }, /* @__PURE__ */ React25.createElement(
-          import_ui19.Typography,
-          {
-            variant: "caption",
-            sx: { color: hasProperties ? "text.disabled" : "error.light" }
-          },
-          (0, import_i18n16.__)("Delete", "elementor")
-        )))
-      )
-    )
-  );
-}
-
-// src/extended/components/component-properties-panel/use-current-editable-item.ts
-var import_react11 = require("react");
-var import_editor_documents6 = require("@elementor/editor-documents");
-var import_editor_ui11 = require("@elementor/editor-ui");
-var import_i18n18 = require("@wordpress/i18n");
-
-// src/extended/store/actions/rename-overridable-group.ts
-function renameOverridableGroup({ componentId, groupId, label }) {
-  const overridableProps = componentsSelectors.getOverridableProps(componentId);
-  if (!overridableProps) {
-    return false;
-  }
-  const group = overridableProps.groups.items[groupId];
-  if (!group) {
-    return false;
-  }
-  const updatedGroups = renameGroup(overridableProps.groups, groupId, label);
-  componentsActions.setOverridableProps(componentId, {
-    ...overridableProps,
-    groups: updatedGroups
-  });
-  return true;
-}
-
-// src/extended/components/component-properties-panel/utils/validate-group-label.ts
-var import_i18n17 = require("@wordpress/i18n");
-var ERROR_MESSAGES2 = {
-  EMPTY_NAME: (0, import_i18n17.__)("Group name is required", "elementor"),
-  DUPLICATE_NAME: (0, import_i18n17.__)("Group name already exists", "elementor")
-};
-function validateGroupLabel(label, existingGroups) {
-  const trimmedLabel = label.trim();
-  if (!trimmedLabel) {
-    return ERROR_MESSAGES2.EMPTY_NAME;
-  }
-  const isDuplicate = Object.values(existingGroups).some((group) => group.label === trimmedLabel);
-  if (isDuplicate) {
-    return ERROR_MESSAGES2.DUPLICATE_NAME;
-  }
-  return "";
-}
-
-// src/extended/components/component-properties-panel/use-current-editable-item.ts
-function useCurrentEditableItem() {
-  const [editingGroupId, setEditingGroupId] = (0, import_react11.useState)(null);
-  const currentComponentId = useCurrentComponentId();
-  const overridableProps = useOverridableProps(currentComponentId);
-  const allGroupsRecord = overridableProps?.groups?.items ?? {};
-  const currentGroup = editingGroupId ? allGroupsRecord[editingGroupId] : null;
-  const validateLabel = (newLabel) => {
-    const otherGroups = Object.fromEntries(
-      Object.entries(allGroupsRecord).filter(([id2]) => id2 !== editingGroupId)
-    );
-    return validateGroupLabel(newLabel, otherGroups) || null;
-  };
-  const handleSubmit = (newLabel) => {
-    if (!editingGroupId || !currentComponentId) {
-      throw new Error((0, import_i18n18.__)("Group ID or component ID is missing", "elementor"));
-    }
-    renameOverridableGroup({
-      componentId: currentComponentId,
-      groupId: editingGroupId,
-      label: newLabel
-    });
-    (0, import_editor_documents6.setDocumentModifiedStatus)(true);
-  };
-  const {
-    ref: editableRef,
-    openEditMode,
-    isEditing,
-    error,
-    getProps: getEditableProps
-  } = (0, import_editor_ui11.useEditable)({
-    value: currentGroup?.label ?? "",
-    onSubmit: handleSubmit,
-    validation: validateLabel
-  });
-  return {
-    editableRef,
-    isEditing,
-    error,
-    getEditableProps,
-    setEditingGroupId: (groupId) => {
-      setEditingGroupId(groupId);
-      openEditMode();
-    },
-    editingGroupId
-  };
-}
-
-// src/extended/components/component-properties-panel/utils/generate-unique-label.ts
-var DEFAULT_NEW_GROUP_LABEL = "New group";
-function generateUniqueLabel(groups) {
-  const existingLabels = new Set(groups.map((group) => group.label));
-  if (!existingLabels.has(DEFAULT_NEW_GROUP_LABEL)) {
-    return DEFAULT_NEW_GROUP_LABEL;
-  }
-  let index = 1;
-  let newLabel = `${DEFAULT_NEW_GROUP_LABEL}-${index}`;
-  while (existingLabels.has(newLabel)) {
-    index++;
-    newLabel = `${DEFAULT_NEW_GROUP_LABEL}-${index}`;
-  }
-  return newLabel;
-}
-
-// src/extended/components/component-properties-panel/component-properties-panel-content.tsx
-function ComponentPropertiesPanelContent({ onClose }) {
-  const currentComponentId = useCurrentComponentId();
-  const overridableProps = useSanitizeOverridableProps(currentComponentId);
-  const [isAddingGroup, setIsAddingGroup] = (0, import_react12.useState)(false);
-  const introductionRef = (0, import_react12.useRef)(null);
-  const groupLabelEditable = useCurrentEditableItem();
-  const groups = (0, import_react12.useMemo)(() => {
-    if (!overridableProps) {
-      return [];
-    }
-    return overridableProps.groups.order.map((groupId) => overridableProps.groups.items[groupId] ?? null).filter(Boolean);
-  }, [overridableProps]);
-  const allGroupsForSelect = (0, import_react12.useMemo)(
-    () => groups.map((group) => ({ value: group.id, label: group.label })),
-    [groups]
-  );
-  if (!currentComponentId || !overridableProps) {
-    return null;
-  }
-  const hasGroups = groups.length > 0;
-  const showEmptyState = !hasGroups && !isAddingGroup;
-  const groupIds = overridableProps.groups.order;
-  const handleAddGroupClick = () => {
-    if (isAddingGroup) {
-      return;
-    }
-    const newGroupId = (0, import_utils6.generateUniqueId)("group");
-    const newLabel = generateUniqueLabel(groups);
-    addOverridableGroup({
-      componentId: currentComponentId,
-      groupId: newGroupId,
-      label: newLabel,
-      source: "user"
-    });
-    (0, import_editor_documents7.setDocumentModifiedStatus)(true);
-    setIsAddingGroup(false);
-    groupLabelEditable.setEditingGroupId(newGroupId);
-  };
-  const handleGroupsReorder = (newOrder) => {
-    reorderOverridableGroups({ componentId: currentComponentId, newOrder });
-    (0, import_editor_documents7.setDocumentModifiedStatus)(true);
-  };
-  const handlePropsReorder = (groupId, newPropsOrder) => {
-    reorderGroupProps({ componentId: currentComponentId, groupId, newPropsOrder });
-    (0, import_editor_documents7.setDocumentModifiedStatus)(true);
-  };
-  const handlePropertyDelete = (propKey) => {
-    deleteOverridableProp({ componentId: currentComponentId, propKey, source: "user" });
-    (0, import_editor_documents7.setDocumentModifiedStatus)(true);
-  };
-  const handlePropertyUpdate = (overrideKey, data) => {
-    updateOverridablePropParams({
-      componentId: currentComponentId,
-      overrideKey,
-      label: data.label,
-      groupId: data.group
-    });
-    (0, import_editor_documents7.setDocumentModifiedStatus)(true);
-  };
-  const handleGroupDelete = (groupId) => {
-    deleteOverridableGroup({ componentId: currentComponentId, groupId });
-    (0, import_editor_documents7.setDocumentModifiedStatus)(true);
-  };
-  return /* @__PURE__ */ React26.createElement(React26.Fragment, null, /* @__PURE__ */ React26.createElement(import_editor_panels3.PanelHeader, { sx: { justifyContent: "start", pl: 1.5, pr: 1, py: 1 } }, /* @__PURE__ */ React26.createElement(import_ui20.Stack, { direction: "row", alignItems: "center", gap: 0.5, flexGrow: 1 }, /* @__PURE__ */ React26.createElement(import_icons14.ComponentPropListIcon, { fontSize: "tiny" }), /* @__PURE__ */ React26.createElement(import_editor_panels3.PanelHeaderTitle, { variant: "subtitle2" }, (0, import_i18n19.__)("Component properties", "elementor"))), !showEmptyState && /* @__PURE__ */ React26.createElement(import_ui20.Tooltip, { title: (0, import_i18n19.__)("Add new group", "elementor") }, /* @__PURE__ */ React26.createElement(
-    import_ui20.IconButton,
-    {
-      size: "tiny",
-      "aria-label": (0, import_i18n19.__)("Add new group", "elementor"),
-      onClick: handleAddGroupClick
-    },
-    /* @__PURE__ */ React26.createElement(import_icons14.FolderPlusIcon, { fontSize: "tiny" })
-  )), /* @__PURE__ */ React26.createElement(import_ui20.Tooltip, { title: (0, import_i18n19.__)("Close panel", "elementor") }, /* @__PURE__ */ React26.createElement(
-    import_ui20.IconButton,
-    {
-      ref: introductionRef,
-      size: "tiny",
-      "aria-label": (0, import_i18n19.__)("Close panel", "elementor"),
-      onClick: onClose
-    },
-    /* @__PURE__ */ React26.createElement(import_icons14.XIcon, { fontSize: "tiny" })
-  ))), /* @__PURE__ */ React26.createElement(import_ui20.Divider, null), /* @__PURE__ */ React26.createElement(import_editor_panels3.PanelBody, null, showEmptyState ? /* @__PURE__ */ React26.createElement(PropertiesEmptyState, { introductionRef }) : /* @__PURE__ */ React26.createElement(import_ui20.List, { sx: { p: 2, display: "flex", flexDirection: "column", gap: 2 } }, /* @__PURE__ */ React26.createElement(SortableProvider, { value: groupIds, onChange: handleGroupsReorder }, groups.map((group) => /* @__PURE__ */ React26.createElement(SortableItem, { key: group.id, id: group.id }, ({ triggerProps, triggerStyle, isDragPlaceholder }) => /* @__PURE__ */ React26.createElement(
-    PropertiesGroup,
-    {
-      group,
-      props: overridableProps.props,
-      allGroups: allGroupsForSelect,
-      allGroupsRecord: overridableProps.groups.items,
-      sortableTriggerProps: { ...triggerProps, style: triggerStyle },
-      isDragPlaceholder,
-      setIsAddingGroup,
-      onPropsReorder: (newOrder) => handlePropsReorder(group.id, newOrder),
-      onPropertyDelete: handlePropertyDelete,
-      onPropertyUpdate: handlePropertyUpdate,
-      editableLabelProps: groupLabelEditable,
-      onGroupDelete: handleGroupDelete
-    }
-  )))))));
-}
-
-// src/extended/components/component-properties-panel/component-properties-panel.tsx
-var id = "component-properties-panel";
-var { panel, usePanelActions } = (0, import_editor_panels4.__createPanel)({
-  id,
-  component: ComponentPropertiesPanel
-});
-function ComponentPropertiesPanel() {
-  const { close: closePanel } = usePanelActions();
-  const { open: openEditingPanel } = (0, import_editor_editing_panel5.usePanelActions)();
-  return /* @__PURE__ */ React27.createElement(import_editor_ui12.ThemeProvider, null, /* @__PURE__ */ React27.createElement(import_ui21.ErrorBoundary, { fallback: /* @__PURE__ */ React27.createElement(ErrorBoundaryFallback, null) }, /* @__PURE__ */ React27.createElement(import_editor_panels4.Panel, null, /* @__PURE__ */ React27.createElement(
-    ComponentPropertiesPanelContent,
-    {
-      onClose: () => {
-        closePanel();
-        openEditingPanel();
-      }
-    }
-  ))));
-}
-var ErrorBoundaryFallback = () => /* @__PURE__ */ React27.createElement(import_ui21.Box, { role: "alert", sx: { minHeight: "100%", p: 2 } }, /* @__PURE__ */ React27.createElement(import_ui21.Alert, { severity: "error", sx: { mb: 2, maxWidth: 400, textAlign: "center" } }, /* @__PURE__ */ React27.createElement("strong", null, (0, import_i18n20.__)("Something went wrong", "elementor"))));
-
-// src/extended/components/component-panel-header/component-badge.tsx
-var React28 = __toESM(require("react"));
-var import_react13 = require("react");
-var import_icons15 = require("@elementor/icons");
-var import_ui22 = require("@elementor/ui");
-var import_i18n21 = require("@wordpress/i18n");
-var ComponentsBadge = React28.forwardRef(({ overridablePropsCount, onClick }, ref) => {
-  const prevCount = usePrevious(overridablePropsCount);
-  const isFirstExposedProperty = prevCount === 0 && overridablePropsCount === 1;
-  return /* @__PURE__ */ React28.createElement(
-    StyledBadge,
-    {
-      ref,
-      color: "primary",
-      key: overridablePropsCount,
-      invisible: overridablePropsCount === 0,
-      animate: isFirstExposedProperty,
-      anchorOrigin: { vertical: "top", horizontal: "right" },
-      badgeContent: /* @__PURE__ */ React28.createElement(import_ui22.Box, { sx: { animation: !isFirstExposedProperty ? `${slideUp} 300ms ease-out` : "none" } }, overridablePropsCount)
-    },
-    /* @__PURE__ */ React28.createElement(import_ui22.Tooltip, { title: (0, import_i18n21.__)("Component properties", "elementor") }, /* @__PURE__ */ React28.createElement(
-      import_ui22.ToggleButton,
-      {
-        value: "exposed properties",
-        size: "tiny",
-        onClick,
-        "aria-label": (0, import_i18n21.__)("Component properties", "elementor")
-      },
-      /* @__PURE__ */ React28.createElement(import_icons15.ComponentPropListIcon, { fontSize: "tiny" })
-    ))
-  );
-});
-var StyledBadge = (0, import_ui22.styled)(import_ui22.Badge, { shouldForwardProp: (prop) => prop !== "animate" })(
-  ({ theme, animate }) => ({
-    "& .MuiBadge-badge": {
-      minWidth: theme.spacing(2),
-      height: theme.spacing(2),
-      minHeight: theme.spacing(2),
-      maxWidth: theme.spacing(2),
-      fontSize: theme.typography.caption.fontSize,
-      animation: animate ? `${bounceIn} 300ms ease-out` : "none"
-    }
-  })
-);
-function usePrevious(value) {
-  const ref = (0, import_react13.useRef)(value);
-  (0, import_react13.useEffect)(() => {
-    ref.current = value;
-  }, [value]);
-  return ref.current;
-}
-var bounceIn = import_ui22.keyframes`
-	0% { transform: scale(0) translate(50%, 50%); opacity: 0; }
-	70% { transform: scale(1.1) translate(50%, -50%); opacity: 1; }
-	100% { transform: scale(1) translate(50%, -50%); opacity: 1; }
-`;
-var slideUp = import_ui22.keyframes`
-	from { transform: translateY(100%); opacity: 0; }
-	to { transform: translateY(0); opacity: 1; }
-`;
-
-// src/extended/components/component-panel-header/component-panel-header.tsx
-var MESSAGE_KEY = "components-properties-introduction";
-var ComponentPanelHeader = () => {
-  const { id: currentComponentId, uid: componentUid } = useCurrentComponent() ?? { id: null, uid: null };
-  const overridableProps = useSanitizeOverridableProps(currentComponentId);
-  const onBack = useNavigateBack();
-  const componentName = getComponentName();
-  const [isMessageSuppressed, suppressMessage] = (0, import_editor_current_user2.useSuppressedMessage)(MESSAGE_KEY);
-  const [shouldShowIntroduction, setShouldShowIntroduction] = React29.useState(!isMessageSuppressed);
-  const { open: openPropertiesPanel } = usePanelActions();
-  const overridablePropsCount = overridableProps ? Object.keys(overridableProps.props).length : 0;
-  const anchorRef = React29.useRef(null);
-  if (!currentComponentId) {
-    return null;
-  }
-  const handleCloseIntroduction = () => {
-    suppressMessage();
-    setShouldShowIntroduction(false);
-  };
-  const handleOpenPropertiesPanel = () => {
-    openPropertiesPanel();
-    trackComponentEvent({
-      action: "propertiesPanelOpened",
-      source: "user",
-      component_uid: componentUid,
-      properties_count: overridablePropsCount
-    });
-  };
-  return /* @__PURE__ */ React29.createElement(import_ui23.Box, { "data-testid": "component-panel-header" }, /* @__PURE__ */ React29.createElement(import_editor_panels5.PanelHeader, { sx: { justifyContent: "start", px: 2 } }, /* @__PURE__ */ React29.createElement(import_ui23.Tooltip, { title: (0, import_i18n22.__)("Back", "elementor") }, /* @__PURE__ */ React29.createElement(import_ui23.IconButton, { size: "tiny", onClick: onBack, "aria-label": (0, import_i18n22.__)("Back", "elementor") }, /* @__PURE__ */ React29.createElement(import_icons16.ArrowLeftIcon, { fontSize: "tiny" }))), /* @__PURE__ */ React29.createElement(import_icons16.ComponentsFilledIcon, { fontSize: "tiny", stroke: "currentColor" }), /* @__PURE__ */ React29.createElement(
-    import_editor_ui13.EllipsisWithTooltip,
-    {
-      title: componentName,
-      as: import_ui23.Typography,
-      variant: "caption",
-      sx: { fontWeight: 500, flexGrow: 1 }
-    }
-  ), /* @__PURE__ */ React29.createElement(
-    ComponentsBadge,
-    {
-      overridablePropsCount,
-      ref: anchorRef,
-      onClick: handleOpenPropertiesPanel
-    }
-  )), /* @__PURE__ */ React29.createElement(import_ui23.Divider, null), /* @__PURE__ */ React29.createElement(
-    ComponentIntroduction,
-    {
-      anchorRef,
-      shouldShowIntroduction,
-      onClose: handleCloseIntroduction
-    }
-  ));
-};
-function getComponentName() {
-  const state = (0, import_store32.__getState)();
-  const path = state[SLICE_NAME].path;
-  const { instanceTitle } = path.at(-1) ?? {};
-  if (instanceTitle) {
-    return instanceTitle;
-  }
-  const documentsManager = (0, import_editor_documents8.getV1DocumentsManager)();
-  const currentDocument = documentsManager.getCurrent();
-  return currentDocument?.container?.settings?.get("post_title") ?? "";
-}
-
-// src/extended/components/components-tab/components.tsx
-var React32 = __toESM(require("react"));
-var import_editor_ui16 = require("@elementor/editor-ui");
-var import_ui25 = require("@elementor/ui");
-
-// src/extended/components/components-tab/component-item.tsx
-var React31 = __toESM(require("react"));
-var import_react14 = require("react");
-var import_editor_canvas5 = require("@elementor/editor-canvas");
-var import_editor_elements13 = require("@elementor/editor-elements");
-var import_editor_ui15 = require("@elementor/editor-ui");
-var import_icons17 = require("@elementor/icons");
-var import_ui24 = require("@elementor/ui");
-var import_i18n26 = require("@wordpress/i18n");
-
-// src/extended/store/actions/archive-component.ts
-var import_editor_documents9 = require("@elementor/editor-documents");
-var import_editor_notifications3 = require("@elementor/editor-notifications");
-var import_i18n23 = require("@wordpress/i18n");
-var successNotification = (componentId, componentName) => ({
-  type: "success",
-  /* translators: %s: component name */
-  message: (0, import_i18n23.__)("Successfully deleted component %s", "elementor").replace("%s", componentName),
-  id: `success-archived-components-notification-${componentId}`
-});
-var archiveComponent = (componentId, componentName) => {
-  componentsActions.archive(componentId);
-  (0, import_editor_documents9.setDocumentModifiedStatus)(true);
-  (0, import_editor_notifications3.notify)(successNotification(componentId, componentName));
-};
-
-// src/extended/store/actions/rename-component.ts
-var import_editor_documents10 = require("@elementor/editor-documents");
-var import_editor_elements11 = require("@elementor/editor-elements");
-var TITLE_EXTERNAL_CHANGE_COMMAND = "title_external_change";
-var renameComponent = (componentUid, newName) => {
-  componentsActions.rename(componentUid, newName);
-  (0, import_editor_documents10.setDocumentModifiedStatus)(true);
-  refreshComponentInstanceTitles(componentUid);
-};
-function refreshComponentInstanceTitles(componentUid) {
-  const documentContainer = getDocumentContainer();
-  if (!documentContainer) {
-    return;
-  }
-  const componentInstances = findComponentInstancesByUid(documentContainer, componentUid);
-  componentInstances.forEach((element) => {
-    element.model.trigger?.(TITLE_EXTERNAL_CHANGE_COMMAND);
-  });
-}
-function getDocumentContainer() {
-  const documentsManager = (0, import_editor_documents10.getV1DocumentsManager)();
-  return documentsManager?.getCurrent()?.container;
-}
-function findComponentInstancesByUid(documentContainer, componentUid) {
-  const allDescendants = (0, import_editor_elements11.getAllDescendants)(documentContainer);
-  return allDescendants.filter((element) => {
-    const widgetType = element.model.get("widgetType");
-    const editorSettings = element.model.get("editor_settings");
-    const isMatch = widgetType === COMPONENT_WIDGET_TYPE2 && editorSettings?.component_uid === componentUid;
-    return isMatch;
-  });
-}
-
-// src/extended/utils/component-form-schema.ts
-var import_schema5 = require("@elementor/schema");
-var import_i18n24 = require("@wordpress/i18n");
-var MIN_NAME_LENGTH = 2;
-var MAX_NAME_LENGTH = 50;
-var baseComponentSchema = import_schema5.z.string().trim().max(MAX_NAME_LENGTH, (0, import_i18n24.__)("Component name is too long. Please keep it under 50 characters.", "elementor"));
-var createBaseComponentSchema = (existingNames) => {
-  return import_schema5.z.object({
-    componentName: baseComponentSchema.refine((value) => !existingNames.includes(value), {
-      message: (0, import_i18n24.__)("Component name already exists", "elementor")
-    })
-  });
-};
-var createSubmitComponentSchema = (existingNames) => {
-  const baseSchema = createBaseComponentSchema(existingNames);
-  return baseSchema.extend({
-    componentName: baseSchema.shape.componentName.refine((value) => value.length > 0, {
-      message: (0, import_i18n24.__)("Component name is required.", "elementor")
-    }).refine((value) => value.length >= MIN_NAME_LENGTH, {
-      message: (0, import_i18n24.__)("Component name is too short. Please enter at least 2 characters.", "elementor")
-    })
-  });
-};
-
-// src/extended/utils/component-name-validation.ts
-function validateComponentName(label) {
-  const existingComponentTitles = componentsSelectors.getComponents()?.map(({ name }) => name) ?? [];
-  const schema = createSubmitComponentSchema(existingComponentTitles);
-  const result = schema.safeParse({ componentName: label.toLowerCase() });
-  if (result.success) {
-    return {
-      isValid: true,
-      errorMessage: null
-    };
-  }
-  const formattedErrors = result.error.format();
-  const errorMessage = formattedErrors.componentName?._errors[0] ?? formattedErrors._errors[0];
-  return {
-    isValid: false,
-    errorMessage
-  };
-}
-
-// src/extended/utils/create-component-model.ts
-var createComponentModel2 = (component) => {
-  return {
-    elType: "widget",
-    widgetType: "e-component",
-    settings: {
-      component_instance: {
-        $$type: "component-instance",
-        value: {
-          component_id: {
-            $$type: "number",
-            value: component.id ?? component.uid
-          }
-        }
-      }
-    },
-    editor_settings: {
-      component_uid: component.uid
-    }
-  };
-};
-
-// src/extended/utils/get-container-for-new-element.ts
-var import_editor_elements12 = require("@elementor/editor-elements");
-var getContainerForNewElement = () => {
-  const currentDocumentContainer = (0, import_editor_elements12.getCurrentDocumentContainer)();
-  const selectedElement = getSelectedElementContainer();
-  let container, options;
-  if (selectedElement) {
-    switch (selectedElement.model.get("elType")) {
-      case "widget": {
-        container = selectedElement?.parent;
-        const selectedElIndex = selectedElement.view?._index ?? -1;
-        if (selectedElIndex > -1) {
-          options = { at: selectedElIndex + 1 };
-        }
-        break;
-      }
-      case "section": {
-        container = selectedElement?.children?.[0];
-        break;
-      }
-      default: {
-        container = selectedElement;
-        break;
-      }
-    }
-  }
-  return { container: container ?? currentDocumentContainer, options };
-};
-function getSelectedElementContainer() {
-  const selectedElements = (0, import_editor_elements12.getSelectedElements)();
-  if (selectedElements.length !== 1) {
-    return void 0;
-  }
-  return (0, import_editor_elements12.getContainer)(selectedElements[0].id);
-}
-
-// src/extended/components/components-tab/delete-confirmation-dialog.tsx
-var React30 = __toESM(require("react"));
-var import_editor_ui14 = require("@elementor/editor-ui");
-var import_i18n25 = require("@wordpress/i18n");
-function DeleteConfirmationDialog({ open, onClose, onConfirm }) {
-  return /* @__PURE__ */ React30.createElement(import_editor_ui14.ConfirmationDialog, { open, onClose }, /* @__PURE__ */ React30.createElement(import_editor_ui14.ConfirmationDialog.Title, null, (0, import_i18n25.__)("Delete this component?", "elementor")), /* @__PURE__ */ React30.createElement(import_editor_ui14.ConfirmationDialog.Content, null, /* @__PURE__ */ React30.createElement(import_editor_ui14.ConfirmationDialog.ContentText, null, (0, import_i18n25.__)(
-    "Existing instances on your pages will remain functional. You will no longer find this component in your list.",
-    "elementor"
-  ))), /* @__PURE__ */ React30.createElement(import_editor_ui14.ConfirmationDialog.Actions, { onClose, onConfirm }));
-}
-
-// src/extended/components/components-tab/component-item.tsx
-function ComponentItem2({ component }) {
-  const itemRef = (0, import_react14.useRef)(null);
-  const [isDeleteDialogOpen, setIsDeleteDialogOpen] = (0, import_react14.useState)(false);
-  const { canRename, canDelete } = useComponentsPermissions();
-  const shouldShowActions = canRename || canDelete;
-  const {
-    ref: editableRef,
-    isEditing,
-    openEditMode,
-    error,
-    getProps: getEditableProps
-  } = (0, import_editor_ui15.useEditable)({
-    value: component.name,
-    onSubmit: (newName) => renameComponent(component.uid, newName),
-    validation: validateComponentTitle
-  });
-  const componentModel = createComponentModel2(component);
-  const popupState = (0, import_ui24.usePopupState)({
-    variant: "popover",
-    disableAutoFocus: true
-  });
-  const handleClick = () => {
-    addComponentToPage(componentModel);
-  };
-  const handleDragEnd = () => {
-    loadComponentsAssets([componentModel]);
-    (0, import_editor_canvas5.endDragElementFromPanel)();
-  };
-  const handleDeleteClick = () => {
-    setIsDeleteDialogOpen(true);
-    popupState.close();
-  };
-  const handleDeleteConfirm = () => {
-    if (!component.id) {
-      throw new Error("Component ID is required");
-    }
-    setIsDeleteDialogOpen(false);
-    archiveComponent(component.id, component.name);
-  };
-  const handleDeleteDialogClose = () => {
-    setIsDeleteDialogOpen(false);
-  };
-  return /* @__PURE__ */ React31.createElement(import_ui24.Stack, null, /* @__PURE__ */ React31.createElement(
-    import_editor_ui15.WarningInfotip,
-    {
-      open: Boolean(error),
-      text: error ?? "",
-      placement: "bottom",
-      width: itemRef.current?.getBoundingClientRect().width,
-      offset: [0, -15]
-    },
-    /* @__PURE__ */ React31.createElement(
-      ComponentItem,
-      {
-        ref: itemRef,
-        component,
-        disabled: false,
-        draggable: true,
-        onDragStart: (event) => (0, import_editor_canvas5.startDragElementFromPanel)(componentModel, event),
-        onDragEnd: handleDragEnd,
-        onClick: handleClick,
-        isEditing,
-        error,
-        nameSlot: /* @__PURE__ */ React31.createElement(
-          ComponentName,
-          {
-            name: component.name,
-            editable: { ref: editableRef, isEditing, getProps: getEditableProps }
-          }
-        ),
-        endSlot: shouldShowActions ? /* @__PURE__ */ React31.createElement(import_ui24.IconButton, { size: "tiny", ...(0, import_ui24.bindTrigger)(popupState), "aria-label": "More actions" }, /* @__PURE__ */ React31.createElement(import_icons17.DotsVerticalIcon, { fontSize: "tiny" })) : void 0
-      }
-    )
-  ), shouldShowActions && /* @__PURE__ */ React31.createElement(
-    import_ui24.Menu,
-    {
-      ...(0, import_ui24.bindMenu)(popupState),
-      anchorOrigin: {
-        vertical: "bottom",
-        horizontal: "right"
-      },
-      transformOrigin: {
-        vertical: "top",
-        horizontal: "right"
-      }
-    },
-    canRename && /* @__PURE__ */ React31.createElement(
-      import_editor_ui15.MenuListItem,
-      {
-        sx: { minWidth: "160px" },
-        primaryTypographyProps: { variant: "caption", color: "text.primary" },
-        onClick: () => {
-          popupState.close();
-          openEditMode();
-        }
-      },
-      (0, import_i18n26.__)("Rename", "elementor")
-    ),
-    canDelete && /* @__PURE__ */ React31.createElement(
-      import_editor_ui15.MenuListItem,
-      {
-        sx: { minWidth: "160px" },
-        primaryTypographyProps: { variant: "caption", color: "error.light" },
-        onClick: handleDeleteClick
-      },
-      (0, import_i18n26.__)("Delete", "elementor")
-    )
-  ), /* @__PURE__ */ React31.createElement(
-    DeleteConfirmationDialog,
-    {
-      open: isDeleteDialogOpen,
-      onClose: handleDeleteDialogClose,
-      onConfirm: handleDeleteConfirm
-    }
-  ));
-}
-var addComponentToPage = (model) => {
-  const { container, options } = getContainerForNewElement();
-  if (!container) {
-    throw new Error(`Can't find container to drop new component instance at`);
-  }
-  loadComponentsAssets([model]);
-  (0, import_editor_elements13.dropElement)({
-    containerId: container.id,
-    model,
-    options: { ...options, useHistory: false, scrollIntoView: true }
-  });
-};
-var validateComponentTitle = (newTitle) => {
-  const result = validateComponentName(newTitle);
-  if (!result.errorMessage) {
-    return null;
-  }
-  return result.errorMessage;
-};
-
-// src/extended/components/components-tab/components.tsx
-var ExtendedComponentsList = () => {
-  const { components, isLoading, searchValue } = useFilteredComponents();
-  if (isLoading) {
-    return /* @__PURE__ */ React32.createElement(LoadingComponents, null);
-  }
-  const isEmpty = !components?.length;
-  if (isEmpty) {
-    return searchValue.length ? /* @__PURE__ */ React32.createElement(EmptySearchResult, null) : /* @__PURE__ */ React32.createElement(EmptyState, null);
-  }
-  return /* @__PURE__ */ React32.createElement(import_ui25.List, { sx: { display: "flex", flexDirection: "column", gap: 1, px: 2 } }, components.map((component) => /* @__PURE__ */ React32.createElement(ComponentItem2, { key: component.uid, component })));
-};
-var ExtendedComponentsContent = () => {
-  const { components, isLoading } = useComponents();
-  const hasComponents = !isLoading && components.length > 0;
-  return /* @__PURE__ */ React32.createElement(React32.Fragment, null, hasComponents && /* @__PURE__ */ React32.createElement(ComponentSearch, null), /* @__PURE__ */ React32.createElement(ExtendedComponentsList, null));
-};
-var ExtendedComponents = () => {
-  return /* @__PURE__ */ React32.createElement(import_editor_ui16.ThemeProvider, null, /* @__PURE__ */ React32.createElement(SearchProvider, { localStorageKey: "elementor-components-search" }, /* @__PURE__ */ React32.createElement(ExtendedComponentsContent, null)));
-};
-
-// src/extended/components/create-component-form/create-component-form.tsx
-var React33 = __toESM(require("react"));
-var import_react16 = require("react");
-var import_editor_elements17 = require("@elementor/editor-elements");
-var import_editor_notifications5 = require("@elementor/editor-notifications");
-var import_editor_ui17 = require("@elementor/editor-ui");
-var import_icons18 = require("@elementor/icons");
-var import_ui26 = require("@elementor/ui");
-var import_i18n29 = require("@wordpress/i18n");
-
-// src/extended/store/actions/create-unpublished-component.ts
-var import_editor_elements15 = require("@elementor/editor-elements");
-var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
-var import_utils7 = require("@elementor/utils");
-var import_i18n27 = require("@wordpress/i18n");
-
-// src/extended/utils/replace-element-with-component.ts
-var import_editor_elements14 = require("@elementor/editor-elements");
-var replaceElementWithComponent = (element, component) => {
-  return (0, import_editor_elements14.replaceElement)({
-    currentElementId: element.id,
-    newElement: createComponentModel2(component),
-    withHistory: false
-  });
-};
-
-// src/extended/store/actions/create-unpublished-component.ts
-async function createUnpublishedComponent({
-  name,
-  element,
-  eventData,
-  uid,
-  overridableProps,
-  source
-}) {
-  const generatedUid = uid ?? (0, import_utils7.generateUniqueId)("component");
-  const componentBase = { uid: generatedUid, name };
-  const elementDataWithOverridablesReverted = revertAllOverridablesInElementData(element);
-  const container = (0, import_editor_elements15.getContainer)(element.id);
-  const modelFromContainer = container?.model?.toJSON?.();
-  const originalElement = {
-    model: modelFromContainer ?? element,
-    parentId: container?.parent?.id ?? "",
-    index: container?.view?._index ?? 0
-  };
-  componentsActions.addUnpublished({
-    ...componentBase,
-    elements: [elementDataWithOverridablesReverted],
-    overridableProps
-  });
-  componentsActions.addCreatedThisSession(generatedUid);
-  const componentInstance = replaceElementWithComponent(element, componentBase);
-  trackComponentEvent({
-    action: "created",
-    source,
-    component_uid: generatedUid,
-    component_name: name,
-    ...eventData
-  });
-  try {
-    await (0, import_editor_v1_adapters4.__privateRunCommand)("document/save/auto");
-  } catch (error) {
-    restoreOriginalElement(originalElement, componentInstance.id);
-    componentsActions.removeUnpublished(generatedUid);
-    componentsActions.removeCreatedThisSession(generatedUid);
-    throw error;
-  }
-  return { uid: generatedUid, instanceId: componentInstance.id };
-}
-function restoreOriginalElement(originalElement, componentInstanceId) {
-  const componentContainer = (0, import_editor_elements15.getContainer)(componentInstanceId);
-  if (componentContainer) {
-    (0, import_editor_elements15.deleteElement)({ container: componentContainer, options: { useHistory: false } });
-  }
-  const parentContainer = (0, import_editor_elements15.getContainer)(originalElement.parentId);
-  if (!parentContainer) {
-    return;
-  }
-  const clonedModel = structuredClone(originalElement.model);
-  (0, import_editor_elements15.createElements)({
-    title: (0, import_i18n27.__)("Restore Element", "elementor"),
-    elements: [
-      {
-        container: parentContainer,
-        model: clonedModel,
-        options: { at: originalElement.index }
-      }
-    ]
-  });
-}
-
-// src/extended/sync/prevent-non-atomic-nesting.ts
-var import_editor_canvas6 = require("@elementor/editor-canvas");
-var import_editor_elements16 = require("@elementor/editor-elements");
-var import_editor_notifications4 = require("@elementor/editor-notifications");
-var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
-var import_i18n28 = require("@wordpress/i18n");
-
-// src/extended/utils/is-editing-component.ts
-function isEditingComponent() {
-  return componentsSelectors.getCurrentComponentId() !== null;
-}
-
-// src/extended/sync/prevent-non-atomic-nesting.ts
-var NON_ATOMIC_ELEMENT_ALERT = {
-  type: "default",
-  message: (0, import_i18n28.__)("This widget isn't compatible with components. Use atomic elements instead.", "elementor"),
-  id: "non-atomic-element-blocked"
-};
-function initNonAtomicNestingPrevention() {
-  (0, import_editor_v1_adapters5.blockCommand)({
-    command: "document/elements/create",
-    condition: blockNonAtomicCreate
-  });
-  (0, import_editor_v1_adapters5.blockCommand)({
-    command: "document/elements/move",
-    condition: blockNonAtomicMove
-  });
-  (0, import_editor_v1_adapters5.blockCommand)({
-    command: "document/elements/paste",
-    condition: blockNonAtomicPaste
-  });
-}
-function isElementAtomic(elementType) {
-  return (0, import_editor_elements16.getElementType)(elementType) !== null;
-}
-function blockNonAtomicCreate(args) {
-  if (!isEditingComponent()) {
-    return false;
-  }
-  const { model } = args;
-  const elementType = model?.widgetType || model?.elType;
-  if (!elementType) {
-    return false;
-  }
-  if (isElementAtomic(elementType)) {
-    return false;
-  }
-  (0, import_editor_notifications4.notify)(NON_ATOMIC_ELEMENT_ALERT);
-  return true;
-}
-function blockNonAtomicMove(args) {
-  if (!isEditingComponent()) {
-    return false;
-  }
-  const { containers = [args.container] } = args;
-  const hasNonAtomicElement = containers.some((container) => {
-    if (!container) {
-      return false;
-    }
-    const allElements = (0, import_editor_elements16.getAllDescendants)(container);
-    return allElements.some((element) => !(0, import_editor_canvas6.isAtomicWidget)(element));
-  });
-  if (hasNonAtomicElement) {
-    (0, import_editor_notifications4.notify)(NON_ATOMIC_ELEMENT_ALERT);
-  }
-  return hasNonAtomicElement;
-}
-function blockNonAtomicPaste(args) {
-  if (!isEditingComponent()) {
-    return false;
-  }
-  const { storageType } = args;
-  if (storageType !== "localstorage") {
-    return false;
-  }
-  const data = window?.elementorCommon?.storage?.get();
-  if (!data?.clipboard?.elements) {
-    return false;
-  }
-  const hasNonAtomicElement = hasNonAtomicElementsInTree(data.clipboard.elements);
-  if (hasNonAtomicElement) {
-    (0, import_editor_notifications4.notify)(NON_ATOMIC_ELEMENT_ALERT);
-  }
-  return hasNonAtomicElement;
-}
-function hasNonAtomicElementsInTree(elements) {
-  for (const element of elements) {
-    const elementType = element.widgetType || element.elType;
-    if (elementType && !isElementAtomic(elementType)) {
-      return true;
-    }
-    if (element.elements?.length) {
-      if (hasNonAtomicElementsInTree(element.elements)) {
-        return true;
-      }
-    }
-  }
-  return false;
-}
-function findNonAtomicElementsInElement(element) {
-  const nonAtomicElements = [];
-  const elementType = element.widgetType || element.elType;
-  if (elementType && !isElementAtomic(elementType)) {
-    nonAtomicElements.push(elementType);
-  }
-  if (element.elements?.length) {
-    for (const child of element.elements) {
-      nonAtomicElements.push(...findNonAtomicElementsInElement(child));
-    }
-  }
-  return [...new Set(nonAtomicElements)];
-}
-
-// src/extended/components/create-component-form/hooks/use-form.ts
-var import_react15 = require("react");
-var useForm = (initialValues) => {
-  const [values, setValues] = (0, import_react15.useState)(initialValues);
-  const [errors, setErrors] = (0, import_react15.useState)({});
-  const isValid = (0, import_react15.useMemo)(() => {
-    return !Object.values(errors).some((error) => error);
-  }, [errors]);
-  const handleChange = (e, field, validationSchema) => {
-    const updated = { ...values, [field]: e.target.value };
-    setValues(updated);
-    const { success, errors: validationErrors } = validateForm(updated, validationSchema);
-    if (!success) {
-      setErrors(validationErrors);
-    } else {
-      setErrors({});
-    }
-  };
-  const validate = (validationSchema) => {
-    const { success, errors: validationErrors, parsedValues } = validateForm(values, validationSchema);
-    if (!success) {
-      setErrors(validationErrors);
-      return { success };
-    }
-    setErrors({});
-    return { success, parsedValues };
-  };
-  return {
-    values,
-    errors,
-    isValid,
-    handleChange,
-    validateForm: validate
-  };
-};
-var validateForm = (values, schema) => {
-  const result = schema.safeParse(values);
-  if (result.success) {
-    return { success: true, parsedValues: result.data };
-  }
-  const errors = {};
-  Object.entries(result.error.formErrors.fieldErrors).forEach(
-    ([field, error]) => {
-      errors[field] = error[0];
-    }
-  );
-  return { success: false, errors };
-};
-
-// src/extended/components/create-component-form/utils/get-component-event-data.ts
-var getComponentEventData = (containerElement, options) => {
-  const { elementsCount, componentsCount } = countNestedElements(containerElement);
-  return {
-    nested_elements_count: elementsCount,
-    nested_components_count: componentsCount,
-    top_element_type: containerElement.elType,
-    location: options?.location,
-    secondary_location: options?.secondaryLocation,
-    trigger: options?.trigger
-  };
-};
-function countNestedElements(container) {
-  if (!container.elements || container.elements.length === 0) {
-    return { elementsCount: 0, componentsCount: 0 };
-  }
-  let elementsCount = container.elements.length;
-  let componentsCount = 0;
-  for (const element of container.elements) {
-    if (element.widgetType === "e-component") {
-      componentsCount++;
-    }
-    const { elementsCount: nestedElementsCount, componentsCount: nestedComponentsCount } = countNestedElements(element);
-    elementsCount += nestedElementsCount;
-    componentsCount += nestedComponentsCount;
-  }
-  return { elementsCount, componentsCount };
-}
-
-// src/extended/components/create-component-form/create-component-form.tsx
-var MAX_COMPONENTS = 100;
-function CreateComponentForm() {
-  const [element, setElement] = (0, import_react16.useState)(null);
-  const [anchorPosition, setAnchorPosition] = (0, import_react16.useState)();
-  const { components } = useComponents();
-  const eventData = (0, import_react16.useRef)(null);
-  (0, import_react16.useEffect)(() => {
-    const OPEN_SAVE_AS_COMPONENT_FORM_EVENT2 = "elementor/editor/open-save-as-component-form";
-    const openPopup = (event) => {
-      const { shouldOpen, notification } = shouldOpenForm(event.detail.element, components?.length ?? 0);
-      if (!shouldOpen) {
-        (0, import_editor_notifications5.notify)(notification);
-        return;
-      }
-      setElement({ element: event.detail.element, elementLabel: (0, import_editor_elements17.getElementLabel)(event.detail.element.id) });
-      setAnchorPosition(event.detail.anchorPosition);
-      eventData.current = getComponentEventData(event.detail.element, event.detail.options);
-      trackComponentEvent({
-        action: "createClicked",
-        source: "user",
-        ...eventData.current
-      });
-    };
-    window.addEventListener(OPEN_SAVE_AS_COMPONENT_FORM_EVENT2, openPopup);
-    return () => {
-      window.removeEventListener(OPEN_SAVE_AS_COMPONENT_FORM_EVENT2, openPopup);
-    };
-  }, [components?.length]);
-  const handleSave = async (values) => {
-    try {
-      if (!element) {
-        throw new Error(`Can't save element as component: element not found`);
-      }
-      const { uid, instanceId } = await createUnpublishedComponent({
-        name: values.componentName,
-        element: element.element,
-        eventData: eventData.current,
-        source: "user"
-      });
-      const publishedComponentId = componentsSelectors.getComponentByUid(uid)?.id;
-      if (publishedComponentId) {
-        switchToComponent(publishedComponentId, instanceId);
-      } else {
-        throw new Error("Failed to find published component");
-      }
-      (0, import_editor_notifications5.notify)({
-        type: "success",
-        message: (0, import_i18n29.__)("Component created successfully.", "elementor"),
-        id: `component-saved-successfully-${uid}`
-      });
-      resetAndClosePopup();
-    } catch {
-      const errorMessage = (0, import_i18n29.__)("Failed to create component. Please try again.", "elementor");
-      (0, import_editor_notifications5.notify)({
-        type: "error",
-        message: errorMessage,
-        id: "component-save-failed"
-      });
-      resetAndClosePopup();
-    }
-  };
-  const resetAndClosePopup = () => {
-    setElement(null);
-    setAnchorPosition(void 0);
-  };
-  const cancelSave = () => {
-    resetAndClosePopup();
-    trackComponentEvent({
-      action: "createCancelled",
-      source: "user",
-      ...eventData.current
-    });
-  };
-  return /* @__PURE__ */ React33.createElement(import_editor_ui17.ThemeProvider, null, /* @__PURE__ */ React33.createElement(
-    import_ui26.Popover,
-    {
-      open: element !== null,
-      onClose: cancelSave,
-      anchorReference: "anchorPosition",
-      anchorPosition,
-      "data-testid": "create-component-form"
-    },
-    element !== null && /* @__PURE__ */ React33.createElement(
-      Form2,
-      {
-        initialValues: { componentName: element.elementLabel },
-        handleSave,
-        closePopup: cancelSave
-      }
-    )
-  ));
-}
-function shouldOpenForm(element, componentsCount) {
-  const nonAtomicElements = findNonAtomicElementsInElement(element);
-  if (nonAtomicElements.length > 0) {
-    return {
-      shouldOpen: false,
-      notification: {
-        type: "default",
-        message: (0, import_i18n29.__)(
-          "Components require atomic elements only. Remove widgets to create this component.",
-          "elementor"
-        ),
-        id: "non-atomic-element-save-blocked"
-      }
-    };
-  }
-  if (componentsCount >= MAX_COMPONENTS) {
-    return {
-      shouldOpen: false,
-      notification: {
-        type: "default",
-        /* translators: %s is the maximum number of components */
-        message: (0, import_i18n29.__)(
-          `You've reached the limit of %s components. Please remove an existing one to create a new component.`,
-          "elementor"
-        ).replace("%s", MAX_COMPONENTS.toString()),
-        id: "maximum-number-of-components-exceeded"
-      }
-    };
-  }
-  return { shouldOpen: true, notification: null };
-}
-var FONT_SIZE = "tiny";
-var Form2 = ({
-  initialValues,
-  handleSave,
-  closePopup
-}) => {
-  const { values, errors, isValid, handleChange, validateForm: validateForm2 } = useForm(initialValues);
-  const nameInputRef = (0, import_editor_ui17.useTextFieldAutoSelect)();
-  const { components } = useComponents();
-  const existingComponentNames = (0, import_react16.useMemo)(() => {
-    return components?.map((component) => component.name) ?? [];
-  }, [components]);
-  const changeValidationSchema = (0, import_react16.useMemo)(
-    () => createBaseComponentSchema(existingComponentNames),
-    [existingComponentNames]
-  );
-  const submitValidationSchema = (0, import_react16.useMemo)(
-    () => createSubmitComponentSchema(existingComponentNames),
-    [existingComponentNames]
-  );
-  const handleSubmit = () => {
-    const { success, parsedValues } = validateForm2(submitValidationSchema);
-    if (success) {
-      handleSave(parsedValues);
-    }
-  };
-  const texts = {
-    heading: (0, import_i18n29.__)("Create component", "elementor"),
-    name: (0, import_i18n29.__)("Name", "elementor"),
-    cancel: (0, import_i18n29.__)("Cancel", "elementor"),
-    create: (0, import_i18n29.__)("Create", "elementor")
-  };
-  const nameInputId = "component-name";
-  return /* @__PURE__ */ React33.createElement(import_editor_ui17.Form, { onSubmit: handleSubmit }, /* @__PURE__ */ React33.createElement(import_ui26.Stack, { alignItems: "start", width: "268px" }, /* @__PURE__ */ React33.createElement(
-    import_ui26.Stack,
-    {
-      direction: "row",
-      alignItems: "center",
-      py: 1,
-      px: 1.5,
-      sx: { columnGap: 0.5, borderBottom: "1px solid", borderColor: "divider", width: "100%" }
-    },
-    /* @__PURE__ */ React33.createElement(import_icons18.ComponentsIcon, { fontSize: FONT_SIZE }),
-    /* @__PURE__ */ React33.createElement(import_ui26.Typography, { variant: "caption", sx: { color: "text.primary", fontWeight: "500", lineHeight: 1 } }, texts.heading)
-  ), /* @__PURE__ */ React33.createElement(import_ui26.Grid, { container: true, gap: 0.75, alignItems: "start", p: 1.5 }, /* @__PURE__ */ React33.createElement(import_ui26.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React33.createElement(import_ui26.FormLabel, { htmlFor: nameInputId, size: "tiny" }, texts.name)), /* @__PURE__ */ React33.createElement(import_ui26.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React33.createElement(
-    import_ui26.TextField,
-    {
-      id: nameInputId,
-      size: FONT_SIZE,
-      fullWidth: true,
-      value: values.componentName,
-      onChange: (e) => handleChange(e, "componentName", changeValidationSchema),
-      inputProps: { style: { color: "text.primary", fontWeight: "600" } },
-      error: Boolean(errors.componentName),
-      helperText: errors.componentName,
-      inputRef: nameInputRef
-    }
-  ))), /* @__PURE__ */ React33.createElement(import_ui26.Stack, { direction: "row", justifyContent: "flex-end", alignSelf: "end", py: 1, px: 1.5 }, /* @__PURE__ */ React33.createElement(import_ui26.Button, { onClick: closePopup, color: "secondary", variant: "text", size: "small" }, texts.cancel), /* @__PURE__ */ React33.createElement(import_ui26.Button, { type: "submit", disabled: !isValid, variant: "contained", color: "primary", size: "small" }, texts.create))));
-};
-
-// src/extended/components/edit-component/edit-component.tsx
-var React35 = __toESM(require("react"));
-var import_react19 = require("react");
-var import_editor_documents11 = require("@elementor/editor-documents");
-var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
-var import_store34 = require("@elementor/store");
-var import_utils9 = require("@elementor/utils");
-
-// src/extended/consts.ts
-var OVERRIDABLE_PROP_REPLACEMENT_ID = "overridable-prop";
-var COMPONENT_DOCUMENT_TYPE = "elementor_component";
-
-// src/extended/store/actions/reset-sanitized-components.ts
-function resetSanitizedComponents() {
-  componentsActions.resetSanitizedComponents();
-}
-
-// src/extended/store/actions/update-current-component.ts
-function updateCurrentComponent(params) {
-  componentsActions.setPath(params.path);
-  componentsActions.setCurrentComponentId(params.currentComponentId);
-}
-
-// src/extended/components/edit-component/component-modal.tsx
-var React34 = __toESM(require("react"));
-var import_react18 = require("react");
-var import_react_dom = require("react-dom");
-var import_i18n30 = require("@wordpress/i18n");
-
-// src/extended/components/edit-component/use-canvas-document.ts
-var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
-function useCanvasDocument() {
-  return (0, import_editor_v1_adapters6.__privateUseListenTo)((0, import_editor_v1_adapters6.commandEndEvent)("editor/documents/attach-preview"), () => (0, import_editor_v1_adapters6.getCanvasIframeDocument)());
-}
-
-// src/extended/components/edit-component/use-element-rect.ts
-var import_react17 = require("react");
-var import_utils8 = require("@elementor/utils");
-function useElementRect(element) {
-  const [rect, setRect] = (0, import_react17.useState)(new DOMRect(0, 0, 0, 0));
-  const onChange = (0, import_utils8.throttle)(
-    () => {
-      setRect(element?.getBoundingClientRect() ?? new DOMRect(0, 0, 0, 0));
-    },
-    20,
-    true
-  );
-  useScrollListener({ element, onChange });
-  useResizeListener({ element, onChange });
-  useMutationsListener({ element, onChange });
-  (0, import_react17.useEffect)(
-    () => () => {
-      onChange.cancel();
-    },
-    [onChange]
-  );
-  return rect;
-}
-function useScrollListener({ element, onChange }) {
-  (0, import_react17.useEffect)(() => {
-    if (!element) {
-      return;
-    }
-    const win = element.ownerDocument?.defaultView;
-    win?.addEventListener("scroll", onChange, { passive: true });
-    return () => {
-      win?.removeEventListener("scroll", onChange);
-    };
-  }, [element, onChange]);
-}
-function useResizeListener({ element, onChange }) {
-  (0, import_react17.useEffect)(() => {
-    if (!element) {
-      return;
-    }
-    const resizeObserver = new ResizeObserver(onChange);
-    resizeObserver.observe(element);
-    const win = element.ownerDocument?.defaultView;
-    win?.addEventListener("resize", onChange, { passive: true });
-    return () => {
-      resizeObserver.disconnect();
-      win?.removeEventListener("resize", onChange);
-    };
-  }, [element, onChange]);
-}
-function useMutationsListener({ element, onChange }) {
-  (0, import_react17.useEffect)(() => {
-    if (!element) {
-      return;
-    }
-    const mutationObserver = new MutationObserver(onChange);
-    mutationObserver.observe(element, { childList: true, subtree: true });
-    return () => {
-      mutationObserver.disconnect();
-    };
-  }, [element, onChange]);
-}
-
-// src/extended/components/edit-component/component-modal.tsx
-function ComponentModal({ topLevelElementDom, onClose }) {
-  const canvasDocument = useCanvasDocument();
-  (0, import_react18.useEffect)(() => {
-    const handleEsc = (event) => {
-      if (event.key === "Escape") {
-        onClose();
-      }
-    };
-    canvasDocument?.body.addEventListener("keydown", handleEsc);
-    return () => {
-      canvasDocument?.body.removeEventListener("keydown", handleEsc);
-    };
-  }, [canvasDocument, onClose]);
-  if (!canvasDocument?.body) {
-    return null;
-  }
-  return (0, import_react_dom.createPortal)(
-    /* @__PURE__ */ React34.createElement(React34.Fragment, null, /* @__PURE__ */ React34.createElement(BlockEditPage, null), /* @__PURE__ */ React34.createElement(Backdrop, { canvas: canvasDocument, element: topLevelElementDom, onClose })),
-    canvasDocument.body
-  );
-}
-function Backdrop({
-  canvas,
-  element,
-  onClose
-}) {
-  const rect = useElementRect(element);
-  const clipPath = element ? getRectPath(rect, canvas.defaultView) : void 0;
-  const backdropStyle = {
-    position: "fixed",
-    top: 0,
-    left: 0,
-    width: "100vw",
-    height: "100vh",
-    backgroundColor: "rgba(0, 0, 0, 0.5)",
-    zIndex: 999,
-    pointerEvents: "painted",
-    cursor: "pointer",
-    clipPath
-  };
-  const handleKeyDown = (event) => {
-    if (event.key === "Enter" || event.key === " ") {
-      event.preventDefault();
-      onClose();
-    }
-  };
-  return /* @__PURE__ */ React34.createElement(
-    "div",
-    {
-      style: backdropStyle,
-      onClick: onClose,
-      onKeyDown: handleKeyDown,
-      role: "button",
-      tabIndex: 0,
-      "aria-label": (0, import_i18n30.__)("Exit component editing mode", "elementor")
-    }
-  );
-}
-function getRectPath(rect, viewport) {
-  const { x, y, width, height } = rect;
-  const { innerWidth: vw, innerHeight: vh } = viewport;
-  const path = `path(evenodd, 'M 0 0 
-		L ${vw} 0
-		L ${vw} ${vh}
-		L 0 ${vh}
-		Z
-		M ${x} ${y}
-		L ${x + width} ${y}
-		L ${x + width} ${y + height}
-		L ${x} ${y + height}
-		L ${x} ${y}
-    	Z'
-	)`;
-  return path.replace(/\s{2,}/g, " ");
-}
-function BlockEditPage() {
-  const blockV3DocumentHandlesStyles = `
-	.elementor-editor-active {
-		& .elementor-section-wrap.ui-sortable {
-			display: contents;
-		}
-
-		& *[data-editable-elementor-document]:not(.elementor-edit-mode):hover {
-			& .elementor-document-handle:not(.elementor-document-save-back-handle) {
-				display: none;
-
-				&::before,
-				& .elementor-document-handle__inner {
-					display: none;
-				}
-			}
-		}
-	}
-	`;
-  return /* @__PURE__ */ React34.createElement("style", { "data-e-style-id": "e-block-v3-document-handles-styles" }, blockV3DocumentHandlesStyles);
-}
-
-// src/extended/components/edit-component/edit-component.tsx
-function EditComponent() {
-  const currentComponentId = useCurrentComponentId();
-  useHandleDocumentSwitches();
-  const navigateBack = useNavigateBack();
-  const onClose = (0, import_utils9.throttle)(navigateBack, 100);
-  const topLevelElementDom = useComponentDOMElement(currentComponentId ?? void 0);
-  if (!currentComponentId) {
-    return null;
-  }
-  return /* @__PURE__ */ React35.createElement(ComponentModal, { topLevelElementDom, onClose });
-}
-function useHandleDocumentSwitches() {
-  const documentsManager = (0, import_editor_documents11.getV1DocumentsManager)();
-  const currentComponentId = useCurrentComponentId();
-  const path = (0, import_store34.__useSelector)(selectPath);
-  (0, import_react19.useEffect)(() => {
-    return (0, import_editor_v1_adapters7.__privateListenTo)((0, import_editor_v1_adapters7.commandEndEvent)("editor/documents/open"), () => {
-      const nextDocument = documentsManager.getCurrent();
-      if (nextDocument.id === currentComponentId) {
-        return;
-      }
-      if (currentComponentId) {
-        apiClient.unlockComponent(currentComponentId);
-      }
-      resetSanitizedComponents();
-      const isComponent2 = nextDocument.config.type === COMPONENT_DOCUMENT_TYPE;
-      if (!isComponent2) {
-        updateCurrentComponent({ path: [], currentComponentId: null });
-        return;
-      }
-      updateCurrentComponent({
-        path: getUpdatedComponentPath(path, nextDocument),
-        currentComponentId: nextDocument.id
-      });
-    });
-  }, [path, documentsManager, currentComponentId]);
-}
-function getUpdatedComponentPath(path, nextDocument) {
-  const componentIndex = path.findIndex(({ componentId }) => componentId === nextDocument.id);
-  if (componentIndex >= 0) {
-    return path.slice(0, componentIndex + 1);
-  }
-  const instanceId = nextDocument?.container.view?.el?.dataset.id;
-  const instanceTitle = getInstanceTitle(instanceId, path);
-  return [
-    ...path,
-    {
-      instanceId,
-      instanceTitle,
-      componentId: nextDocument.id
-    }
-  ];
-}
-function getInstanceTitle(instanceId, path) {
-  if (!instanceId) {
-    return void 0;
-  }
-  const documentsManager = (0, import_editor_documents11.getV1DocumentsManager)();
-  const parentDocId = path.at(-1)?.componentId ?? documentsManager.getInitialId();
-  const parentDoc = documentsManager.get(parentDocId);
-  const parentContainer = parentDoc?.container;
-  const widget = parentContainer?.children?.findRecursive?.(
-    (container) => container.id === instanceId
-  );
-  const editorSettings = widget?.model?.get?.("editor_settings");
-  return editorSettings?.title;
-}
-function useComponentDOMElement(id2) {
-  const { componentContainerDomElement, topLevelElementDom } = getComponentDOMElements(id2);
-  const [currentElementDom, setCurrentElementDom] = (0, import_react19.useState)(topLevelElementDom);
-  (0, import_react19.useEffect)(() => {
-    setCurrentElementDom(topLevelElementDom);
-  }, [topLevelElementDom]);
-  (0, import_react19.useEffect)(() => {
-    if (!componentContainerDomElement) {
-      return;
-    }
-    const mutationObserver = new MutationObserver(() => {
-      const newElementDom = componentContainerDomElement.children[0];
-      setCurrentElementDom(newElementDom);
-    });
-    mutationObserver.observe(componentContainerDomElement, { childList: true });
-    return () => {
-      mutationObserver.disconnect();
-    };
-  }, [componentContainerDomElement]);
-  return currentElementDom;
-}
-function getComponentDOMElements(id2) {
-  if (!id2) {
-    return { componentContainerDomElement: null, topLevelElementDom: null };
-  }
-  const documentsManager = (0, import_editor_documents11.getV1DocumentsManager)();
-  const currentComponent = documentsManager.get(id2);
-  const componentContainer = currentComponent?.container;
-  const componentContainerDomElement = componentContainer?.view?.el?.children?.[0] ?? null;
-  const topLevelElementDom = componentContainerDomElement?.children[0] ?? null;
-  return { componentContainerDomElement, topLevelElementDom };
-}
-
-// src/extended/components/instance-editing-panel/instance-editing-panel.tsx
-var React36 = __toESM(require("react"));
-var import_icons19 = require("@elementor/icons");
-var import_ui27 = require("@elementor/ui");
-var import_i18n31 = require("@wordpress/i18n");
-function ExtendedInstanceEditingPanel() {
-  const { canEdit } = useComponentsPermissions();
-  const data = useInstancePanelData();
-  if (!data) {
-    return null;
-  }
-  const { componentId, component, overrides, overridableProps, groups, isEmpty, componentInstanceId } = data;
-  const panelTitle = (0, import_i18n31.__)("Edit %s", "elementor").replace("%s", component.name);
-  const handleEditComponent = () => switchToComponent(componentId, componentInstanceId);
-  return /* @__PURE__ */ React36.createElement(import_ui27.Box, { "data-testid": "instance-editing-panel" }, /* @__PURE__ */ React36.createElement(
-    ComponentInstanceProvider,
-    {
-      componentId,
-      overrides,
-      overridableProps
-    },
-    /* @__PURE__ */ React36.createElement(
-      InstancePanelHeader,
-      {
-        componentName: component.name,
-        actions: canEdit ? /* @__PURE__ */ React36.createElement(
-          EditComponentAction,
-          {
-            label: panelTitle,
-            onClick: handleEditComponent,
-            icon: import_icons19.PencilIcon
-          }
-        ) : void 0
-      }
-    ),
-    /* @__PURE__ */ React36.createElement(
-      InstancePanelBody,
-      {
-        groups,
-        isEmpty,
-        emptyState: /* @__PURE__ */ React36.createElement(EmptyState2, { onEditComponent: canEdit ? handleEditComponent : void 0 }),
-        componentInstanceId
-      }
-    )
-  ));
-}
-
-// src/extended/components/overridable-props/overridable-prop-control.tsx
-var React37 = __toESM(require("react"));
-var import_editor_controls5 = require("@elementor/editor-controls");
-var import_editor_editing_panel6 = require("@elementor/editor-editing-panel");
-function OverridablePropControl({
-  OriginalControl: OriginalControl2,
-  ...props
-}) {
-  const { elementType } = (0, import_editor_editing_panel6.useElement)();
-  const { value, bind, setValue, placeholder, ...propContext } = (0, import_editor_controls5.useBoundProp)(componentOverridablePropTypeUtil);
-  const componentId = useCurrentComponentId();
-  const overridableProps = useOverridableProps(componentId);
-  const filteredReplacements = (0, import_editor_controls5.getControlReplacements)().filter(
-    (r) => !r.id || r.id !== OVERRIDABLE_PROP_REPLACEMENT_ID
-  );
-  if (!componentId) {
-    return null;
-  }
-  if (!value?.override_key) {
-    throw new Error("Override key is required");
-  }
-  const isComponentInstance2 = elementType.key === "e-component";
-  const overridablePropData = overridableProps?.props?.[value.override_key];
-  const setOverridableValue = (newValue) => {
-    const propValue2 = {
-      ...value,
-      origin_value: newValue[bind]
-    };
-    setValue(propValue2);
-    if (!isComponentInstance2) {
-      updateOverridableProp(componentId, propValue2, overridablePropData?.originPropFields);
-    }
-  };
-  const defaultPropType = elementType.propsSchema[bind];
-  const overridePropType = overridablePropData ? getPropTypeForComponentOverride(overridablePropData) : void 0;
-  const resolvedPropType = overridePropType ?? defaultPropType;
-  if (!resolvedPropType) {
-    return null;
-  }
-  const propType = (0, import_editor_editing_panel6.createTopLevelObjectType)({
-    schema: {
-      [bind]: resolvedPropType
-    }
-  });
-  const propValue = isComponentInstance2 ? (value.origin_value?.value).override_value : value.origin_value;
-  const objectPlaceholder = placeholder ? { [bind]: placeholder } : void 0;
-  return /* @__PURE__ */ React37.createElement(OverridablePropProvider, { value }, /* @__PURE__ */ React37.createElement(
-    import_editor_controls5.PropProvider,
-    {
-      ...propContext,
-      propType,
-      setValue: setOverridableValue,
-      value: {
-        [bind]: propValue
-      },
-      placeholder: objectPlaceholder
-    },
-    /* @__PURE__ */ React37.createElement(import_editor_controls5.PropKeyProvider, { bind }, /* @__PURE__ */ React37.createElement(import_editor_controls5.ControlReplacementsProvider, { replacements: filteredReplacements }, /* @__PURE__ */ React37.createElement(ControlWithReplacements, { OriginalControl: OriginalControl2, props })))
-  ));
-}
-function ControlWithReplacements({
-  OriginalControl: OriginalControl2,
-  props
-}) {
-  const { ControlToRender, isReplaced } = (0, import_editor_controls5.useControlReplacement)(OriginalControl2);
-  if (isReplaced) {
-    const ReplacementControl = ControlToRender;
-    return /* @__PURE__ */ React37.createElement(ReplacementControl, { ...props, OriginalControl: OriginalControl2 });
-  }
-  return /* @__PURE__ */ React37.createElement(OriginalControl2, { ...props });
-}
-
-// src/extended/components/overridable-props/overridable-prop-indicator.tsx
-var React39 = __toESM(require("react"));
-var import_editor_controls6 = require("@elementor/editor-controls");
-var import_editor_editing_panel7 = require("@elementor/editor-editing-panel");
-var import_editor_elements18 = require("@elementor/editor-elements");
-var import_ui29 = require("@elementor/ui");
-var import_i18n33 = require("@wordpress/i18n");
-
-// src/extended/store/actions/set-overridable-prop.ts
-var import_utils10 = require("@elementor/utils");
-function setOverridableProp({
-  componentId,
-  overrideKey,
-  elementId,
-  label,
-  groupId,
-  propKey,
-  elType,
-  widgetType,
-  originValue,
-  originPropFields,
-  source
-}) {
-  const overridableProps = componentsSelectors.getOverridableProps(componentId);
-  if (!overridableProps) {
-    return;
-  }
-  const existingOverridableProp = overrideKey ? overridableProps.props[overrideKey] : null;
-  const duplicatedTargetProps = Object.values(overridableProps.props).filter(
-    (prop) => prop.elementId === elementId && prop.propKey === propKey && prop !== existingOverridableProp
-  );
-  const { groups: groupsAfterResolve, groupId: currentGroupId } = resolveOrCreateGroup(
-    overridableProps.groups,
-    groupId || existingOverridableProp?.groupId || void 0
-  );
-  const overridableProp = {
-    overrideKey: existingOverridableProp?.overrideKey || (0, import_utils10.generateUniqueId)("prop"),
-    label,
-    elementId,
-    propKey,
-    widgetType,
-    elType,
-    originValue,
-    groupId: currentGroupId,
-    originPropFields
-  };
-  const stateAfterRemovingDuplicates = removePropsFromState(
-    { ...overridableProps, groups: groupsAfterResolve },
-    duplicatedTargetProps
-  );
-  const props = {
-    ...stateAfterRemovingDuplicates.props,
-    [overridableProp.overrideKey]: overridableProp
-  };
-  let groups = addPropToGroup(stateAfterRemovingDuplicates.groups, currentGroupId, overridableProp.overrideKey);
-  groups = ensureGroupInOrder(groups, currentGroupId);
-  const isChangingGroups = existingOverridableProp && existingOverridableProp.groupId !== currentGroupId;
-  if (isChangingGroups) {
-    groups = removePropFromGroup(groups, existingOverridableProp.groupId, overridableProp.overrideKey);
-  }
-  componentsActions.setOverridableProps(componentId, { props, groups });
-  const isNewProperty = !existingOverridableProp;
-  if (isNewProperty) {
-    const currentComponent = componentsSelectors.getCurrentComponent();
-    trackComponentEvent({
-      action: "propertyExposed",
-      source,
-      component_uid: currentComponent?.uid,
-      property_id: overridableProp.overrideKey,
-      property_path: propKey,
-      property_name: label,
-      element_type: widgetType ?? elType
-    });
-  }
-  return overridableProp;
-}
-
-// src/extended/components/overridable-props/indicator.tsx
-var React38 = __toESM(require("react"));
-var import_react20 = require("react");
-var import_icons20 = require("@elementor/icons");
-var import_ui28 = require("@elementor/ui");
-var import_i18n32 = require("@wordpress/i18n");
-var SIZE2 = "tiny";
-var IconContainer = (0, import_ui28.styled)(import_ui28.Box)`
-	pointer-events: none;
-	opacity: 0;
-	transition: opacity 0.2s ease-in-out;
-
-	& > svg {
-		position: absolute;
-		top: 50%;
-		left: 50%;
-		transform: translate( -50%, -50% );
-		width: 10px;
-		height: 10px;
-		fill: ${({ theme }) => theme.palette.primary.contrastText};
-		stroke: ${({ theme }) => theme.palette.primary.contrastText};
-		stroke-width: 2px;
-	}
-`;
-var Content = (0, import_ui28.styled)(import_ui28.Box)`
-	position: relative;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	cursor: pointer;
-	width: 16px;
-	height: 16px;
-	margin-inline: ${({ theme }) => theme.spacing(0.5)};
-
-	&:before {
-		content: '';
-		display: block;
-		position: absolute;
-		top: 50%;
-		left: 50%;
-		transform: translate( -50%, -50% ) rotate( 45deg );
-		width: 5px;
-		height: 5px;
-		border-radius: 1px;
-		background-color: ${({ theme }) => theme.palette.primary.main};
-		transition: all 0.1s ease-in-out;
-	}
-
-	&:hover,
-	&.enlarged {
-		&:before {
-			width: 12px;
-			height: 12px;
-			border-radius: 2px;
-		}
-
-		.icon {
-			opacity: 1;
-		}
-	}
-`;
-var Indicator2 = (0, import_react20.forwardRef)(({ isOpen, isOverridable, ...props }, ref) => /* @__PURE__ */ React38.createElement(
-  Content,
-  {
-    role: "button",
-    ref,
-    ...props,
-    className: isOpen || isOverridable ? "enlarged" : "",
-    "aria-label": isOverridable ? (0, import_i18n32.__)("Overridable property", "elementor") : (0, import_i18n32.__)("Make prop overridable", "elementor")
-  },
-  /* @__PURE__ */ React38.createElement(IconContainer, { className: "icon" }, isOverridable ? /* @__PURE__ */ React38.createElement(import_icons20.CheckIcon, { fontSize: SIZE2 }) : /* @__PURE__ */ React38.createElement(import_icons20.PlusIcon, { fontSize: SIZE2 }))
-));
-
-// src/extended/components/overridable-props/overridable-prop-indicator.tsx
-function OverridablePropIndicator() {
-  const { propType } = (0, import_editor_controls6.useBoundProp)();
-  const componentId = useCurrentComponentId();
-  const overridableProps = useSanitizeOverridableProps(componentId);
-  if (!isPropAllowed(propType) || !componentId || !overridableProps) {
-    return null;
-  }
-  return /* @__PURE__ */ React39.createElement(Content2, { componentId, overridableProps });
-}
-function Content2({ componentId, overridableProps }) {
-  const {
-    element: { id: elementId },
-    elementType
-  } = (0, import_editor_editing_panel7.useElement)();
-  const { value, bind, propType } = (0, import_editor_controls6.useBoundProp)();
-  const contextOverridableValue = useOverridablePropValue();
-  const componentInstanceElement = useComponentInstanceElement();
-  const { value: boundPropOverridableValue, setValue: setOverridableValue } = (0, import_editor_controls6.useBoundProp)(
-    componentOverridablePropTypeUtil
-  );
-  const overridableValue = boundPropOverridableValue ?? contextOverridableValue;
-  const popupState = (0, import_ui29.usePopupState)({
-    variant: "popover"
-  });
-  const triggerProps = (0, import_ui29.bindTrigger)(popupState);
-  const popoverProps = (0, import_ui29.bindPopover)(popupState);
-  const { elType } = (0, import_editor_elements18.getWidgetsCache)()?.[elementType.key] ?? { elType: "widget" };
-  const handleSubmit = ({ label, group }) => {
-    const propTypeDefault = propType.default ?? {};
-    const originValue = resolveOverridePropValue(overridableValue?.origin_value) ?? value ?? propTypeDefault;
-    const matchingOverridableProp = overridableValue ? overridableProps?.props?.[overridableValue.override_key] : void 0;
-    const overridablePropConfig = setOverridableProp({
-      componentId,
-      overrideKey: overridableValue?.override_key ?? null,
-      elementId: componentInstanceElement?.element.id ?? elementId,
-      label,
-      groupId: group,
-      propKey: bind,
-      elType: elType ?? "widget",
-      widgetType: componentInstanceElement?.elementType.key ?? elementType.key,
-      originValue,
-      originPropFields: matchingOverridableProp?.originPropFields,
-      source: "user"
-    });
-    if (!overridableValue && overridablePropConfig) {
-      setOverridableValue({
-        override_key: overridablePropConfig.overrideKey,
-        origin_value: originValue
-      });
-    }
-    popupState.close();
-  };
-  const overridableConfig = overridableValue ? getOverridableProp({ componentId, overrideKey: overridableValue.override_key }) : void 0;
-  return /* @__PURE__ */ React39.createElement(React39.Fragment, null, /* @__PURE__ */ React39.createElement(import_ui29.Tooltip, { placement: "top", title: (0, import_i18n33.__)("Override Property", "elementor") }, /* @__PURE__ */ React39.createElement(Indicator2, { ...triggerProps, isOpen: !!popoverProps.open, isOverridable: !!overridableValue })), /* @__PURE__ */ React39.createElement(
-    import_ui29.Popover,
-    {
-      disableScrollLock: true,
-      anchorOrigin: {
-        vertical: "bottom",
-        horizontal: "right"
-      },
-      transformOrigin: {
-        vertical: "top",
-        horizontal: "right"
-      },
-      PaperProps: {
-        sx: { my: 2.5 }
-      },
-      ...popoverProps
-    },
-    /* @__PURE__ */ React39.createElement(
-      OverridablePropForm,
-      {
-        onSubmit: handleSubmit,
-        groups: overridableProps?.groups.order.map((groupId) => ({
-          value: groupId,
-          label: overridableProps.groups.items[groupId].label
-        })),
-        existingLabels: Object.values(overridableProps?.props ?? {}).map((prop) => prop.label),
-        currentValue: overridableConfig
-      }
-    )
-  ));
-}
-function isPropAllowed(propType) {
-  return propType.meta.overridable !== false;
-}
-
-// src/extended/mcp/index.ts
-var import_editor_mcp2 = require("@elementor/editor-mcp");
-
-// src/extended/mcp/save-as-component-tool.ts
-var import_editor_canvas7 = require("@elementor/editor-canvas");
-var import_editor_elements19 = require("@elementor/editor-elements");
-var import_editor_mcp = require("@elementor/editor-mcp");
-var import_http_client2 = require("@elementor/http-client");
-var import_schema6 = require("@elementor/schema");
-var import_utils11 = require("@elementor/utils");
-var InputSchema = {
-  element_id: import_schema6.z.string().describe(
-    'The unique identifier of the element to save as a component. Use the "list-elements" tool to find available element IDs in the current document.'
-  ),
-  component_name: import_schema6.z.string().describe("The name for the new component. Should be descriptive and unique among existing components."),
-  overridable_props: import_schema6.z.object({
-    props: import_schema6.z.record(
-      import_schema6.z.object({
-        elementId: import_schema6.z.string().describe("The id of the child element that you want to override its settings"),
-        propKey: import_schema6.z.string().describe(
-          'The property key of the child element that you want to override its settings (e.g., "text", "url", "tag"). To get the available propKeys for an element, use the "get-element-type-config" tool.'
-        ),
-        label: import_schema6.z.string().describe(
-          'A unique, user-friendly display name for this property (e.g., "Hero Headline", "CTA Button Text"). Must be unique within the same component.'
-        ),
-        group: import_schema6.z.string().optional().describe("Non unique, optional property grouping")
-      })
-    )
-  }).optional().describe(
-    'Overridable properties configuration. Specify which CHILD element properties can be customized. Only elementId and propKey are required; To get the available propKeys for a child element you must use the "get-element-type-config" tool.'
-  ),
-  groups: import_schema6.z.array(import_schema6.z.string()).describe("Property Groups, by order, unique values").optional()
-};
-var OutputSchema = {
-  message: import_schema6.z.string().optional().describe("Additional information about the operation result"),
-  component_uid: import_schema6.z.string().optional().describe("The unique identifier of the newly created component (only present on success)")
-};
-var ERROR_MESSAGES3 = {
-  ELEMENT_NOT_FOUND: "Element not found. Use 'list-elements' to get valid element IDs.",
-  ELEMENT_NOT_ONE_OF_TYPES: (validTypes) => `Element is not one of the following types: ${validTypes.join(", ")}`,
-  ELEMENT_IS_LOCKED: "Cannot save a locked element as a component."
-};
-var handleSaveAsComponent = async (params) => {
-  const {
-    groups = [],
-    element_id: elementId,
-    component_name: componentName,
-    overridable_props: overridablePropsInput
-  } = params;
-  const validElementTypes = getValidElementTypes();
-  const container = (0, import_editor_elements19.getContainer)(elementId);
-  if (!container) {
-    throw new Error(ERROR_MESSAGES3.ELEMENT_NOT_FOUND);
-  }
-  const elType = container.model.get("elType");
-  if (!validElementTypes.includes(elType)) {
-    throw new Error(ERROR_MESSAGES3.ELEMENT_NOT_ONE_OF_TYPES(validElementTypes));
-  }
-  const element = container.model.toJSON({ remove: ["default"] });
-  if (element?.isLocked) {
-    throw new Error(ERROR_MESSAGES3.ELEMENT_IS_LOCKED);
-  }
-  const groupsWithDefaultGroup = groups.indexOf("Default") >= 0 ? [...groups] : ["Default", ...groups];
-  const propertyGroups = groupsWithDefaultGroup.map((groupName) => ({
-    id: (0, import_utils11.generateUniqueId)("group"),
-    label: groupName,
-    props: []
-  }));
-  const overridableProps = overridablePropsInput ? enrichOverridableProps(overridablePropsInput, element, propertyGroups) : void 0;
-  if (overridableProps) {
-    updateElementDataWithOverridableProps(element, overridableProps);
-  }
-  const uid = (0, import_utils11.generateUniqueId)("component");
-  try {
-    await apiClient.validate({
-      items: [
-        { uid, title: componentName, elements: [element], settings: { overridable_props: overridableProps } }
-      ]
-    });
-  } catch (error) {
-    if (error instanceof import_http_client2.AxiosError) {
-      throw new Error(error.response?.data.messge);
-    }
-    throw new Error("Unknown error");
-  }
-  await createUnpublishedComponent({
-    name: componentName,
-    element,
-    eventData: null,
-    uid,
-    overridableProps,
-    source: "mcp_tool"
-  });
-  return {
-    status: "ok",
-    message: `Component "${componentName}" created successfully.`,
-    component_uid: uid
-  };
-};
-function enrichOverridableProps(input, rootElement, propertGroups) {
-  const enrichedProps = {};
-  const enrichedGroups = {};
-  const defaultGroup = propertGroups.find((g) => g.label === "Default");
-  if (!defaultGroup) {
-    throw new Error("Internal mcp error: could not generate default group");
-  }
-  Object.entries(input.props).forEach(([, prop]) => {
-    const { elementId, propKey, label, group = "Default" } = prop;
-    const targetGroup = propertGroups.find((g) => g.label === group) || defaultGroup;
-    const targetGroupId = targetGroup.id;
-    const element = findElementById(rootElement, elementId);
-    if (!element) {
-      throw new Error(`Element with ID "${elementId}" not found in component`);
-    }
-    const elType = element.elType;
-    const widgetType = element.widgetType || element.elType;
-    const elementType = (0, import_editor_elements19.getElementType)(widgetType);
-    if (!elementType) {
-      throw new Error(
-        `Element type "${widgetType}" is not atomic or does not have a settings schema. Cannot expose property "${propKey}" for element "${elementId}".`
-      );
-    }
-    if (!elementType.propsSchema[propKey]) {
-      const availableProps = Object.keys(elementType.propsSchema).join(", ");
-      throw new Error(
-        `Property "${propKey}" does not exist in element "${elementId}" (type: ${widgetType}). Available properties: ${availableProps}`
-      );
-    }
-    const overrideKey = (0, import_utils11.generateUniqueId)("prop");
-    const originValue = element.settings?.[propKey] ? element.settings[propKey] : elementType.propsSchema[propKey].default ?? null;
-    if (!enrichedGroups[targetGroupId]) {
-      enrichedGroups[targetGroupId] = {
-        id: targetGroupId,
-        label: targetGroup.label,
-        props: []
-      };
-    }
-    enrichedGroups[targetGroupId].props.push(overrideKey);
-    enrichedProps[overrideKey] = {
-      overrideKey,
-      label,
-      elementId,
-      propKey,
-      elType,
-      widgetType,
-      originValue,
-      groupId: targetGroupId
-    };
-  });
-  return {
-    props: enrichedProps,
-    groups: {
-      items: enrichedGroups,
-      order: [defaultGroup.id]
-    }
-  };
-}
-function updateElementDataWithOverridableProps(rootElement, overridableProps) {
-  Object.values(overridableProps.props).forEach((prop) => {
-    const element = findElementById(rootElement, prop.elementId);
-    if (!element || !element.settings) {
-      return;
-    }
-    element.settings[prop.propKey] = {
-      $$type: "overridable",
-      value: {
-        override_key: prop.overrideKey,
-        origin_value: prop.originValue
-      }
-    };
-  });
-}
-function findElementById(root, targetId) {
-  if (root.id === targetId) {
-    return root;
-  }
-  if (root.elements) {
-    for (const child of root.elements) {
-      const found = findElementById(child, targetId);
-      if (found) {
-        return found;
-      }
-    }
-  }
-  return null;
-}
-function getValidElementTypes() {
-  const types = (0, import_editor_elements19.getWidgetsCache)();
-  if (!types) {
-    return [];
-  }
-  return Object.entries(types).reduce((acc, [type, value]) => {
-    if (!value.atomic_props_schema || !value.show_in_panel || value.elType === "widget") {
-      return acc;
-    }
-    acc.push(type);
-    return acc;
-  }, []);
-}
-var generatePrompt = () => {
-  const saveAsComponentPrompt = (0, import_editor_mcp.toolPrompts)("save-as-component");
-  saveAsComponentPrompt.description(`
-Save an existing element as a reusable component in the Elementor editor.
-
-# When to use this tool
-Use this tool when the user wants to:
-- Create a reusable component from an existing element structure
-- Make specific child element properties customizable in component instances
-- Build a library of reusable design patterns
-
-# When NOT to use this tool
-- Element is already a component (widgetType: 'e-component')
-- Element is locked
-- Element is not an atomic element (atomic_props_schema is not defined)
-- Element elType is a 'widget'
-
-# **CRITICAL - REQUIRED RESOURCES (Must read before using this tool)**
-1. [${import_editor_canvas7.DOCUMENT_STRUCTURE_URI}]
-   **MANDATORY** - Required to understand the document structure and identify child elements for overridable properties.
-   Use this resource to find element IDs and understand the element hierarchy.
-
-2. [${import_editor_canvas7.WIDGET_SCHEMA_URI}]
-   **MANDATORY** - Required to understand which properties are available for each widget type.
-   Use this to identify available propKeys in the atomic_props_schema for child elements.
-
-# Instructions - MUST FOLLOW IN ORDER
-## Step 1: Identify the Target Element
-1. Read the [${import_editor_canvas7.DOCUMENT_STRUCTURE_URI}] resource to understand the document structure
-2. Locate the element you want to save as a component by its element_id
-3. Verify the element type is a valid element type
-4. Ensure the element is not locked and is not already a component
-
-## Step 2: Define Overridable Properties
-Do this step to make child element properties customizable.
-Skip that step ONLY if the user explicitly requests to not make any properties customizable.
-
-1. **Identify Child Elements**
-   - Use the [${import_editor_canvas7.DOCUMENT_STRUCTURE_URI}] resource to find all child elements
-   - Note the elementId and widgetType/elType of each child element you want to customize
-
-2. **Find Available Properties**
-   - Use the [${import_editor_canvas7.WIDGET_SCHEMA_URI}] resource to find the child element's widget type schema
-   - Review the atomic_props_schema to find available propKeys (ONLY use top-level props)
-   - Common propKeys include: "text", "url", "tag", "size", etc.
-   - Use only the top level properties, do not use nested properties.
-
-3. **Build the overridable_props Object**
-   - For each property you want to make overridable, add an entry:
-     \`{ "elementId": "<child-element-id>", "propKey": "<property-key>", "label": "<user-friendly-name>" }\`
-   - The label must be unique within the component and should be meaningful to the user (e.g., "Hero Headline", "CTA Button Text")
-   - Group all entries under the "props" object
-
-## Step 3: Execute the Tool
-Call the tool with:
-- element_id: The ID of the parent element to save as component
-- component_name: A descriptive name for the component
-- overridable_props: (Optional) The properties configuration from Step 2
-
-# CONSTRAINTS
-- NEVER try to override properties of the parent element itself - ONLY child elements
-- NEVER use invalid propKeys - always verify against the widget's atomic_props_schema in [${import_editor_canvas7.WIDGET_SCHEMA_URI}]
-- Property keys must exist in the child element's atomic_props_schema
-- Element IDs must exist within the target element's children
-- When tool execution fails, read the error message and adjust accordingly
-- The element being saved must not be inside another component
-`);
-  saveAsComponentPrompt.parameter(
-    "element_id",
-    `**MANDATORY** The unique identifier of the element to save as a component.
-Use the [${import_editor_canvas7.DOCUMENT_STRUCTURE_URI}] resource to find available element IDs.`
-  );
-  saveAsComponentPrompt.parameter(
-    "component_name",
-    `**MANDATORY** A descriptive name for the new component.
-Should be unique and clearly describe the component's purpose (e.g., "Hero Section", "Feature Card").`
-  );
-  saveAsComponentPrompt.parameter(
-    "overridable_props",
-    `**OPTIONAL** Configuration for which child element properties can be customized in component instances.
-
-Structure:
-\`\`\`json
-{
-  "props": {
-    "<unique-key>": {
-      "elementId": "<child-element-id>",
-      "propKey": "<property-key>",
-      "label": "<user-friendly-name>"
-    }
-  }
-}
-\`\`\`
-
-To populate this correctly:
-1. Use [${import_editor_canvas7.DOCUMENT_STRUCTURE_URI}] to find child element IDs and their widgetType
-2. Use [${import_editor_canvas7.WIDGET_SCHEMA_URI}] to find the atomic_props_schema for each child element's widgetType
-3. Only include properties you want to be customizable in component instances
-4. Provide a unique, user-friendly label for each property (e.g., "Hero Headline", "CTA Button Text")`
-  );
-  saveAsComponentPrompt.example(`
-Basic component without overridable properties:
-\`\`\`json
-{
-  "element_id": "abc123",
-  "component_name": "Hero Section"
-}
-\`\`\`
-
-Component with overridable properties:
-\`\`\`json
-{
-  "element_id": "abc123",
-  "component_name": "Feature Card",
-  "overridable_props": {
-    "props": {
-      "heading-text": {
-        "elementId": "heading-123",
-        "propKey": "text",
-        "label": "Card Title",
-        "group": "Content"
-      },
-      "button-text": {
-        "elementId": "button-456",
-        "propKey": "text",
-        "label": "Button Text",
-        "group": "Content"
-      },
-      "button-link": {
-        "elementId": "button-456",
-        "propKey": "url",
-        "label": "Button Link",
-        "group": "Settings"
-      }
-    }
-  }
-}
-\`\`\`
-`);
-  saveAsComponentPrompt.instruction(
-    `After successful creation, the component will be available in the components library and can be inserted into any page or template.`
-  );
-  saveAsComponentPrompt.instruction(
-    `When overridable properties are defined, component instances will show customization controls for those specific properties in the editing panel.`
-  );
-  return saveAsComponentPrompt.prompt();
-};
-var initSaveAsComponentTool = () => {
-  return (0, import_editor_mcp.getMCPByDomain)("components").addTool({
-    name: "save-as-component",
-    schema: InputSchema,
-    outputSchema: OutputSchema,
-    description: generatePrompt(),
-    handler: handleSaveAsComponent
-  });
-};
-
-// src/extended/mcp/index.ts
-function initMcp() {
-  const { setMCPDescription } = (0, import_editor_mcp2.getMCPByDomain)("components");
-  setMCPDescription(
-    `Elementor Editor Components MCP - Tools for creating and managing reusable components. 
-        Components are reusable blocks of content that can be used multiple times across the pages, its a widget which contains a set of elements and styles.`
-  );
-  initSaveAsComponentTool();
-}
-
-// src/sync/publish-draft-components-in-page-before-save.ts
-var import_editor_documents12 = require("@elementor/editor-documents");
-async function publishDraftComponentsInPageBeforeSave({ status, elements }) {
-  if (status !== "publish") {
-    return;
-  }
-  const documents = await getComponentDocuments(elements);
-  const draftIds = [...documents.values()].filter(import_editor_documents12.isDocumentDirty).map((document) => document.id);
-  if (draftIds.length === 0) {
-    return;
-  }
-  await apiClient.updateStatuses(draftIds, "publish");
-  draftIds.forEach((id2) => (0, import_editor_documents12.invalidateDocumentData)(id2));
-}
-
-// src/extended/sync/set-component-overridable-props-settings-before-save.ts
-var setComponentOverridablePropsSettingsBeforeSave = ({
-  container
-}) => {
-  const currentDocument = container.document;
-  if (!currentDocument || currentDocument.config.type !== COMPONENT_DOCUMENT_TYPE) {
-    return;
-  }
-  const overridableProps = componentsSelectors.getOverridableProps(currentDocument.id);
-  if (overridableProps) {
-    container.settings.set("overridable_props", overridableProps);
-  }
-};
-
-// src/extended/sync/update-archived-component-before-save.ts
-var import_editor_notifications6 = require("@elementor/editor-notifications");
-var failedNotification = (message) => ({
-  type: "error",
-  message: `Failed to archive components: ${message}`,
-  id: "failed-archived-components-notification"
-});
-var updateArchivedComponentBeforeSave = async (status) => {
-  try {
-    const archivedComponents = componentsSelectors.getArchivedThisSession();
-    if (!archivedComponents.length) {
-      return;
-    }
-    const result = await apiClient.updateArchivedComponents(archivedComponents, status);
-    const failedIds = result.failedIds.join(", ");
-    if (failedIds) {
-      (0, import_editor_notifications6.notify)(failedNotification(failedIds));
-    }
-  } catch (error) {
-    throw new Error(`Failed to update archived components: ${error}`);
-  }
-};
-
-// src/extended/sync/update-component-title-before-save.ts
-var updateComponentTitleBeforeSave = async (status) => {
-  const updatedComponentNames = componentsSelectors.getUpdatedComponentNames();
-  if (!updatedComponentNames.length) {
-    return;
-  }
-  const result = await apiClient.updateComponentTitle(updatedComponentNames, status);
-  if (result.failedIds.length === 0) {
-    componentsActions.cleanUpdatedComponentNames();
-  }
-};
-
-// src/extended/sync/create-components-before-save.ts
-var import_editor_elements20 = require("@elementor/editor-elements");
-async function createComponentsBeforeSave({
-  elements,
-  status
-}) {
-  const unpublishedComponents = componentsSelectors.getUnpublishedComponents();
-  if (!unpublishedComponents.length) {
-    return;
-  }
-  try {
-    const uidToComponentId = await createComponents(unpublishedComponents, status);
-    updateComponentInstances(elements, uidToComponentId);
-    componentsActions.add(
-      unpublishedComponents.map((component) => ({
-        id: uidToComponentId.get(component.uid),
-        name: component.name,
-        uid: component.uid,
-        overridableProps: component.overridableProps ? component.overridableProps : void 0
-      }))
-    );
-    componentsActions.resetUnpublished();
-  } catch (error) {
-    const failedUids = unpublishedComponents.map((component) => component.uid);
-    componentsActions.removeUnpublished(failedUids);
-    throw new Error(`Failed to publish components: ${error}`);
-  }
-}
-async function createComponents(components, status) {
-  const response = await apiClient.create({
-    status,
-    items: components.map((component) => ({
-      uid: component.uid,
-      title: component.name,
-      elements: component.elements,
-      settings: component.overridableProps ? { overridable_props: component.overridableProps } : void 0
-    }))
-  });
-  const map = /* @__PURE__ */ new Map();
-  Object.entries(response).forEach(([key, value]) => {
-    map.set(key, value);
-  });
-  return map;
-}
-function updateComponentInstances(elements, uidToComponentId) {
-  elements.forEach((element) => {
-    const { shouldUpdate, newComponentId } = shouldUpdateElement(element, uidToComponentId);
-    if (shouldUpdate) {
-      updateElementComponentId(element.id, newComponentId);
-    }
-    if (element.elements) {
-      updateComponentInstances(element.elements, uidToComponentId);
-    }
-  });
-}
-function shouldUpdateElement(element, uidToComponentId) {
-  if (element.widgetType === "e-component") {
-    const currentComponentId = element.settings?.component_instance?.value?.component_id.value;
-    if (currentComponentId && uidToComponentId.has(currentComponentId.toString())) {
-      return {
-        shouldUpdate: true,
-        newComponentId: uidToComponentId.get(currentComponentId.toString())
-      };
-    }
-  }
-  return { shouldUpdate: false, newComponentId: null };
-}
-function updateElementComponentId(elementId, componentId) {
-  (0, import_editor_elements20.updateElementSettings)({
-    id: elementId,
-    props: {
-      component_instance: {
-        $$type: "component-instance",
-        value: {
-          component_id: { $$type: "number", value: componentId }
-        }
-      }
-    },
-    withHistory: false
-  });
-}
-
-// src/extended/sync/before-save.ts
-var beforeSave = ({ container, status }) => {
-  const elements = container?.model.get("elements").toJSON?.() ?? [];
-  return Promise.all([
-    syncComponents({ elements, status }),
-    setComponentOverridablePropsSettingsBeforeSave({ container })
-  ]);
-};
-var syncComponents = async ({ elements, status }) => {
-  await updateExistingComponentsBeforeSave({ elements, status });
-  await createComponentsBeforeSave({ elements, status });
-};
-var updateExistingComponentsBeforeSave = async ({
-  elements,
-  status
-}) => {
-  await updateComponentTitleBeforeSave(status);
-  await updateArchivedComponentBeforeSave(status);
-  await publishDraftComponentsInPageBeforeSave({ elements, status });
-};
-
-// src/extended/sync/cleanup-overridable-props-on-delete.ts
-var import_editor_elements21 = require("@elementor/editor-elements");
-var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
-function initCleanupOverridablePropsOnDelete() {
-  (0, import_editor_v1_adapters8.registerDataHook)("dependency", "document/elements/delete", (args, options) => {
-    if (isPartOfMoveCommand(options)) {
-      return true;
-    }
-    const currentComponentId = componentsSelectors.getCurrentComponentId();
-    if (!currentComponentId) {
-      return true;
-    }
-    const overridableProps = componentsSelectors.getOverridableProps(currentComponentId);
-    if (!overridableProps || Object.keys(overridableProps.props).length === 0) {
-      return true;
-    }
-    const containers = args.containers ?? (args.container ? [args.container] : []);
-    if (containers.length === 0) {
-      return true;
-    }
-    const deletedElementIds = collectDeletedElementIds(containers);
-    if (deletedElementIds.length === 0) {
-      return true;
-    }
-    const propKeysToDelete = Object.entries(overridableProps.props).filter(([, prop]) => deletedElementIds.includes(prop.elementId)).map(([propKey]) => propKey);
-    if (propKeysToDelete.length === 0) {
-      return true;
-    }
-    deleteOverridableProp({ componentId: currentComponentId, propKey: propKeysToDelete, source: "system" });
-    return true;
-  });
-}
-function collectDeletedElementIds(containers) {
-  const elementIds = containers.filter(Boolean).flatMap((container) => [container, ...(0, import_editor_elements21.getAllDescendants)(container)]).map((element) => element.model?.get?.("id") ?? element.id).filter((id2) => Boolean(id2));
-  return elementIds;
-}
-function isPartOfMoveCommand(options) {
-  const isMoveCommandInTrace = options?.commandsCurrentTrace?.includes("document/elements/move") || options?.commandsCurrentTrace?.includes("document/repeater/move");
-  return Boolean(isMoveCommandInTrace);
-}
-
-// src/extended/sync/handle-component-edit-mode-container.ts
-var import_editor_elements22 = require("@elementor/editor-elements");
-var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
-var V4_DEFAULT_CONTAINER_TYPE = "e-flexbox";
-function initHandleComponentEditModeContainer() {
-  initRedirectDropIntoComponent();
-  initHandleTopLevelElementDelete();
-}
-function initHandleTopLevelElementDelete() {
-  (0, import_editor_v1_adapters9.registerDataHook)("after", "document/elements/delete", (args) => {
-    if (!isEditingComponent()) {
-      return;
-    }
-    const containers = args.containers ?? (args.container ? [args.container] : []);
-    for (const container of containers) {
-      if (!container.parent || !isComponent(container.parent)) {
-        continue;
-      }
-      const component = container.parent;
-      const isComponentEmpty = component.children?.length === 0;
-      if (isComponentEmpty) {
-        createEmptyTopLevelContainer(container.parent);
-      }
-    }
-  });
-}
-function initRedirectDropIntoComponent() {
-  (0, import_editor_v1_adapters9.registerDataHook)("dependency", "preview/drop", (args) => {
-    if (!isEditingComponent()) {
-      return true;
-    }
-    const containers = args.containers ?? (args.container ? [args.container] : []);
-    for (const container of containers) {
-      if (!isComponent(container)) {
-        continue;
-      }
-      const { shouldRedirect, container: redirectedContainer } = getComponentContainer(container);
-      if (!shouldRedirect) {
-        continue;
-      }
-      if (args.containers) {
-        const index = args.containers.indexOf(container);
-        args.containers[index] = redirectedContainer;
-      } else {
-        args.container = redirectedContainer;
-      }
-    }
-    return true;
-  });
-}
-function createEmptyTopLevelContainer(container) {
-  const newContainer = (0, import_editor_elements22.createElement)({
-    container,
-    model: { elType: V4_DEFAULT_CONTAINER_TYPE }
-  });
-  (0, import_editor_elements22.selectElement)(newContainer.id);
-}
-function getComponentContainer(container) {
-  const topLevelElement = container.children?.[0];
-  if (topLevelElement) {
-    return { shouldRedirect: true, container: topLevelElement };
-  }
-  return { shouldRedirect: false, container };
-}
-function isComponent(container) {
-  const isDocument = container.id === "document";
-  if (!isDocument) {
-    return false;
-  }
-  return container.document?.config.type === COMPONENT_DOCUMENT_TYPE;
-}
-
-// src/extended/sync/revert-overridables-on-copy-or-duplicate.ts
-var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
-function initRevertOverridablesOnCopyOrDuplicate() {
-  (0, import_editor_v1_adapters10.registerDataHook)("after", "document/elements/duplicate", (_args, result) => {
-    if (!isEditingComponent()) {
-      return;
-    }
-    revertOverridablesForDuplicatedElements(result);
-  });
-  (0, import_editor_v1_adapters10.registerDataHook)("after", "document/elements/copy", (args) => {
-    if (!isEditingComponent()) {
-      return;
-    }
-    revertOverridablesInStorage(args.storageKey ?? "clipboard");
-  });
-}
-function revertOverridablesForDuplicatedElements(duplicatedElements) {
-  const containers = Array.isArray(duplicatedElements) ? duplicatedElements : [duplicatedElements];
-  containers.forEach((container) => {
-    revertAllOverridablesInContainer(container);
-  });
-}
-function revertOverridablesInStorage(storageKey) {
-  const storage = window.elementorCommon?.storage;
-  if (!storage) {
-    return;
-  }
-  const storageData = storage.get(storageKey);
-  if (!storageData?.elements?.length) {
-    return;
-  }
-  const elementsDataWithOverridablesReverted = storageData.elements.map(revertAllOverridablesInElementData);
-  storage.set(storageKey, {
-    ...storageData,
-    elements: elementsDataWithOverridablesReverted
-  });
-}
-
-// src/extended/sync/sanitize-overridable-props.ts
-var import_react21 = require("react");
-
-// src/extended/store/actions/update-component-sanitized-attribute.ts
-function updateComponentSanitizedAttribute(componentId, attribute) {
-  componentsActions.updateComponentSanitizedAttribute(componentId, attribute);
-}
-
-// src/extended/sync/sanitize-overridable-props.ts
-function SanitizeOverridableProps() {
-  const currentComponentId = useCurrentComponentId();
-  const overridableProps = useOverridableProps(currentComponentId);
-  const isSanitized = useIsSanitizedComponent(currentComponentId, "overridableProps");
-  (0, import_react21.useEffect)(() => {
-    if (isSanitized || !overridableProps || !currentComponentId) {
-      return;
-    }
-    const filtered = filterValidOverridableProps(overridableProps);
-    const propsToDelete = Object.keys(overridableProps.props ?? {}).filter((key) => !filtered.props[key]);
-    if (propsToDelete.length > 0) {
-      propsToDelete.forEach((key) => {
-        deleteOverridableProp({ componentId: currentComponentId, propKey: key, source: "system" });
-      });
-    }
-    updateComponentSanitizedAttribute(currentComponentId, "overridableProps");
-  }, [currentComponentId, isSanitized, overridableProps]);
-  return null;
-}
-
-// src/extended/init.ts
-var PRIORITY = 1;
-function initExtended() {
-  (0, import_editor_editing_panel8.registerEditingPanelReplacement)({
-    id: "extended-component-instance-edit-panel",
-    priority: PRIORITY,
-    condition: (_, elementType) => elementType.key === "e-component",
-    component: ExtendedInstanceEditingPanel
-  });
-  (0, import_editor_elements_panel.registerTab)({
-    id: "components",
-    label: (0, import_i18n34.__)("Components", "elementor"),
-    component: ExtendedComponents,
-    priority: PRIORITY
-  });
-  (0, import_editor_panels6.__registerPanel)(panel);
-  (0, import_editor_v1_adapters11.registerDataHook)("dependency", "editor/documents/close", (args) => {
-    const document = (0, import_editor_documents13.getV1CurrentDocument)();
-    if (document.config.type === COMPONENT_DOCUMENT_TYPE) {
-      args.mode = "autosave";
-    }
-    return true;
-  });
-  (0, import_editor_v1_adapters11.registerDataHook)("after", "preview/drop", onElementDrop);
-  window.elementorCommon.__beforeSave = beforeSave;
-  (0, import_editor.injectIntoTop)({
-    id: "create-component-popup",
-    component: CreateComponentForm
-  });
-  (0, import_editor.injectIntoTop)({
-    id: "edit-component",
-    component: EditComponent
-  });
-  (0, import_editor_editing_panel8.injectIntoPanelHeaderTop)({
-    id: "component-panel-header",
-    component: ComponentPanelHeader
-  });
-  (0, import_editor_editing_panel8.registerFieldIndicator)({
-    fieldType: import_editor_editing_panel8.FIELD_TYPE.SETTINGS,
-    id: "component-overridable-prop",
-    priority: 1,
-    indicator: OverridablePropIndicator
-  });
-  (0, import_editor_controls7.registerControlReplacement)({
-    id: OVERRIDABLE_PROP_REPLACEMENT_ID,
-    component: OverridablePropControl,
-    condition: ({ value }) => componentOverridablePropTypeUtil.isValid(value)
-  });
-  initCleanupOverridablePropsOnDelete();
-  initMcp();
-  initNonAtomicNestingPrevention();
-  initHandleComponentEditModeContainer();
-  initRevertOverridablesOnCopyOrDuplicate();
-  (0, import_editor.injectIntoLogic)({
-    id: "sanitize-overridable-props",
-    component: SanitizeOverridableProps
-  });
-}
-
-// src/extended/shortcuts/create-component-shortcut.ts
-var import_editor_elements23 = require("@elementor/editor-elements");
-var import_utils12 = require("@elementor/utils");
-var CREATE_COMPONENT_SHORTCUT_KEYS = "ctrl+shift+k";
-var OPEN_SAVE_AS_COMPONENT_FORM_EVENT = "elementor/editor/open-save-as-component-form";
-function isCreateComponentAllowed() {
-  const selectedElements = (0, import_editor_elements23.getSelectedElements)();
-  if (selectedElements.length !== 1) {
-    return { allowed: false };
-  }
-  const element = selectedElements[0];
-  const elementType = (0, import_editor_elements23.getElementType)(element.type);
-  if (!elementType) {
-    return { allowed: false };
-  }
-  if (!(0, import_utils12.isProActive)()) {
-    return { allowed: false };
-  }
-  const widgetsCache = (0, import_editor_elements23.getWidgetsCache)();
-  const elementConfig = widgetsCache?.[element.type];
-  if (!elementConfig?.atomic_props_schema || !elementConfig?.show_in_panel || elementConfig?.elType === "widget") {
-    return { allowed: false };
-  }
-  const legacyWindow = window;
-  const container = legacyWindow.elementor.getContainer(element.id);
-  if (!container || container.isLocked()) {
-    return { allowed: false };
-  }
-  return { allowed: true, container };
-}
-function triggerCreateComponentForm(container) {
-  const legacyWindow = window;
-  const elementRect = container.view.el.getBoundingClientRect();
-  const iframeRect = legacyWindow.elementor.$preview[0].getBoundingClientRect();
-  const anchorPosition = {
-    left: iframeRect.left + elementRect.left + elementRect.width / 2,
-    top: iframeRect.top + elementRect.top
-  };
-  window.dispatchEvent(
-    new CustomEvent(OPEN_SAVE_AS_COMPONENT_FORM_EVENT, {
-      detail: {
-        element: container.model.toJSON({ remove: ["default"] }),
-        anchorPosition,
-        options: {
-          trigger: "keyboard",
-          location: "canvas",
-          secondaryLocation: "canvasElement"
-        }
-      }
-    })
-  );
-}
-function initCreateComponentShortcut() {
-  const legacyWindow = window;
-  legacyWindow.$e.shortcuts.register(CREATE_COMPONENT_SHORTCUT_KEYS, {
-    callback: () => {
-      const result = isCreateComponentAllowed();
-      if (!result.allowed) {
-        return;
-      }
-      triggerCreateComponentForm(result.container);
-    },
-    dependency: () => {
-      const result = isCreateComponentAllowed();
-      return result.allowed;
-    },
-    exclude: ["input"]
-  });
-}
-
-// src/populate-store.ts
-var import_react22 = require("react");
-var import_store39 = require("@elementor/store");
-function PopulateStore() {
-  (0, import_react22.useEffect)(() => {
-    (0, import_store39.__dispatch)(loadComponents());
-  }, []);
-  return null;
-}
-
-// src/prevent-circular-nesting.ts
-var import_editor_elements24 = require("@elementor/editor-elements");
-var import_editor_notifications7 = require("@elementor/editor-notifications");
-var import_editor_v1_adapters12 = require("@elementor/editor-v1-adapters");
-var import_store40 = require("@elementor/store");
-var import_i18n35 = require("@wordpress/i18n");
-var COMPONENT_TYPE = "e-component";
-var COMPONENT_CIRCULAR_NESTING_ALERT = {
-  type: "default",
-  message: (0, import_i18n35.__)("Can't add this component - components that contain each other can't be nested.", "elementor"),
-  id: "circular-component-nesting-blocked"
-};
-function initCircularNestingPrevention() {
-  (0, import_editor_v1_adapters12.blockCommand)({
-    command: "document/elements/create",
-    condition: blockCircularCreate
-  });
-  (0, import_editor_v1_adapters12.blockCommand)({
-    command: "document/elements/move",
-    condition: blockCircularMove
-  });
-  (0, import_editor_v1_adapters12.blockCommand)({
-    command: "document/elements/paste",
-    condition: blockCircularPaste
-  });
-}
-function wouldCreateCircularNesting(componentIdToAdd) {
-  if (componentIdToAdd === void 0) {
-    return false;
-  }
-  const state = (0, import_store40.__getState)();
-  const currentComponentId = selectCurrentComponentId(state);
-  const path = selectPath(state);
-  if (currentComponentId === null) {
-    return false;
-  }
-  if (componentIdToAdd === currentComponentId) {
-    return true;
-  }
-  return path.some((item) => item.componentId === componentIdToAdd);
-}
-function extractComponentIdFromModel(model) {
-  if (!model) {
-    return null;
-  }
-  const isComponent2 = model.widgetType === COMPONENT_TYPE;
-  if (!isComponent2) {
-    return null;
-  }
-  return model.settings?.component_instance?.value?.component_id?.value ?? null;
-}
-function extractComponentIdFromElement(element) {
-  if (element.widgetType !== COMPONENT_TYPE) {
-    return null;
-  }
-  return element.settings?.component_instance?.value?.component_id?.value ?? null;
-}
-function extractComponentIdsFromElements(elements) {
-  const ids = [];
-  for (const element of elements) {
-    const componentId = extractComponentIdFromElement(element);
-    if (componentId !== null) {
-      ids.push(componentId);
-    }
-    if (element.elements?.length) {
-      ids.push(...extractComponentIdsFromElements(element.elements));
-    }
-  }
-  return ids;
-}
-function extractComponentIdFromContainer(container) {
-  const widgetType = container.model?.get?.("widgetType");
-  if (widgetType !== COMPONENT_TYPE) {
-    return null;
-  }
-  const settings = container.model?.get?.("settings");
-  const componentInstance = settings?.get?.("component_instance");
-  return componentInstance?.value?.component_id?.value ?? null;
-}
-function blockCircularCreate(args) {
-  const componentId = extractComponentIdFromModel(args.model);
-  if (componentId === null) {
-    return false;
-  }
-  const isBlocked = wouldCreateCircularNesting(componentId);
-  if (isBlocked) {
-    (0, import_editor_notifications7.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
-  }
-  return isBlocked;
-}
-function blockCircularMove(args) {
-  const { containers = [args.container] } = args;
-  const hasCircularComponent = containers.some((container) => {
-    if (!container) {
-      return false;
-    }
-    const allElements = (0, import_editor_elements24.getAllDescendants)(container);
-    return allElements.some((element) => {
-      const componentId = extractComponentIdFromContainer(element);
-      if (componentId === null) {
-        return false;
-      }
-      return wouldCreateCircularNesting(componentId);
-    });
-  });
-  if (hasCircularComponent) {
-    (0, import_editor_notifications7.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
-  }
-  return hasCircularComponent;
-}
-function blockCircularPaste(args) {
-  const { storageType } = args;
-  if (storageType !== "localstorage") {
-    return false;
-  }
-  const data = window?.elementorCommon?.storage?.get();
-  if (!data?.clipboard?.elements) {
-    return false;
-  }
-  const allComponentIds = extractComponentIdsFromElements(data.clipboard.elements);
-  const hasCircularComponent = allComponentIds.some(wouldCreateCircularNesting);
-  if (hasCircularComponent) {
-    (0, import_editor_notifications7.notify)(COMPONENT_CIRCULAR_NESTING_ALERT);
-  }
-  return hasCircularComponent;
-}
-
-// src/store/actions/remove-component-styles.ts
-var import_store42 = require("@elementor/store");
-function removeComponentStyles(id2) {
-  apiClient.invalidateComponentConfigCache(id2);
-  (0, import_store42.__dispatch)(slice.actions.removeStyles({ id: id2 }));
-}
-
-// src/store/components-styles-provider.ts
-var import_editor_styles_repository = require("@elementor/editor-styles-repository");
-var import_store44 = require("@elementor/store");
-var componentsStylesProvider = (0, import_editor_styles_repository.createStylesProvider)({
-  key: "components-styles",
-  priority: 100,
-  subscribe: (cb) => (0, import_store44.__subscribeWithSelector)(
-    (state) => state[SLICE_NAME],
-    () => {
-      cb();
-    }
-  ),
-  actions: {
-    all: () => {
-      return selectFlatStyles((0, import_store44.__getState)());
-    },
-    get: (id2) => {
-      return selectFlatStyles((0, import_store44.__getState)()).find((style) => style.id === id2) ?? null;
-    }
-  }
-});
-
 // src/sync/before-save.ts
-var beforeSave2 = ({ container, status }) => {
+var beforeSave = ({ container, status }) => {
   const elements = container?.model.get("elements").toJSON?.() ?? [];
   return publishDraftComponentsInPageBeforeSave({ elements, status });
 };
 
 // src/sync/load-component-data-after-instance-added.ts
-var import_editor_v1_adapters13 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
 function initLoadComponentDataAfterInstanceAdded() {
-  (0, import_editor_v1_adapters13.registerDataHook)("after", "document/elements/paste", (_args, result) => {
+  (0, import_editor_v1_adapters5.registerDataHook)("after", "document/elements/paste", (_args, result) => {
     load(result);
   });
-  (0, import_editor_v1_adapters13.registerDataHook)("after", "document/elements/import", (_args, result) => {
+  (0, import_editor_v1_adapters5.registerDataHook)("after", "document/elements/import", (_args, result) => {
     load(result);
   });
 }
@@ -6466,11 +2794,10 @@ function load(result) {
 }
 
 // src/init.ts
-var PRO_EXTENDED_MIGRATION_VERSION = "4.0.0";
 function init() {
   import_editor_styles_repository2.stylesRepository.register(componentsStylesProvider);
-  (0, import_store46.__registerSlice)(slice);
-  (0, import_editor_canvas8.registerElementType)(
+  (0, import_store35.__registerSlice)(slice);
+  (0, import_editor_canvas5.registerElementType)(
     COMPONENT_WIDGET_TYPE2,
     (options) => createComponentType({
       ...options,
@@ -6478,44 +2805,38 @@ function init() {
       showDetachConfirmDialog: openDetachConfirmDialog
     })
   );
-  window.elementorCommon.__beforeSave = beforeSave2;
-  (0, import_editor_elements_panel2.injectTab)({
+  window.elementorCommon.__beforeSave = beforeSave;
+  (0, import_editor_elements_panel.injectTab)({
     id: "components",
-    label: (0, import_i18n36.__)("Components", "elementor"),
+    label: (0, import_i18n12.__)("Components", "elementor"),
     component: Components,
     position: 1
   });
-  (0, import_editor2.injectIntoLogic)({
+  (0, import_editor.injectIntoLogic)({
     id: "components-populate-store",
     component: PopulateStore
   });
-  (0, import_editor_v1_adapters14.registerDataHook)("after", "editor/documents/attach-preview", async () => {
-    const { id: id2, config } = (0, import_editor_documents14.getV1CurrentDocument)();
-    if (id2) {
-      removeComponentStyles(id2);
+  (0, import_editor_v1_adapters6.registerDataHook)("after", "editor/documents/attach-preview", async () => {
+    const { id, config } = (0, import_editor_documents6.getV1CurrentDocument)();
+    if (id) {
+      removeComponentStyles(id);
     }
     await loadComponentsAssets(config?.elements ?? []);
   });
-  (0, import_editor2.injectIntoLogic)({
+  (0, import_editor.injectIntoLogic)({
     id: "templates",
     component: LoadTemplateComponents
   });
-  (0, import_editor_editing_panel9.registerEditingPanelReplacement)({
+  (0, import_editor_editing_panel5.registerEditingPanelReplacement)({
     id: "component-instance-edit-panel",
     condition: (_, elementType) => elementType.key === "e-component",
     component: InstanceEditingPanel
   });
-  import_editor_canvas8.settingsTransformersRegistry.register("component-instance", componentInstanceTransformer);
-  import_editor_canvas8.settingsTransformersRegistry.register("overridable", componentOverridableTransformer);
-  import_editor_canvas8.settingsTransformersRegistry.register("override", componentOverrideTransformer);
+  import_editor_canvas5.settingsTransformersRegistry.register("component-instance", componentInstanceTransformer);
+  import_editor_canvas5.settingsTransformersRegistry.register("overridable", componentOverridableTransformer);
+  import_editor_canvas5.settingsTransformersRegistry.register("override", componentOverrideTransformer);
   initCircularNestingPrevention();
   initLoadComponentDataAfterInstanceAdded();
-  if (!!window.elementorPro && !(0, import_utils13.isProAtLeast)(PRO_EXTENDED_MIGRATION_VERSION)) {
-    initExtended();
-  }
-  if (!!window.elementorPro) {
-    initCreateComponentShortcut();
-  }
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {