@elementor/editor-elements 3.32.0-70 → 3.32.0-72

package/dist/index.d.mts

@@ -43,9 +43,13 @@ type V1Element = {
     id: string;
     model: V1Model<V1ElementModelProps>;
     settings: V1Model<V1ElementSettingsProps>;
-    children?: V1Element[];
+    children?: V1Element[] & {
+        findRecursive?: (predicate: (child: V1Element) => boolean) => V1Element | undefined;
+        forEachRecursive?: (callback: (child: V1Element) => void) => V1Element[];
+    };
     view?: {
         el?: HTMLElement;
+        _index?: number;
         getDomElement?: () => {
             get?: (index: number) => HTMLElement | undefined;
         };
@@ -102,23 +106,60 @@ declare function useElementChildren<T extends ElementChildren>(elementId: Elemen
 
 type Options$1 = {
     useHistory?: boolean;
+    at?: number;
 };
-declare function createElement({ containerId, settings, type, id, options, }: {
+type CreateElementParams = {
     settings: V1ElementSettingsProps;
     type: string;
     containerId: string;
     id?: string;
     options?: Options$1;
-}): V1Element;
+};
+declare function createElement({ containerId, settings, type, id, options }: CreateElementParams): V1Element;
+
+type CreateNestedElementsParams = {
+    elements: CreateElementParams[];
+    title: string;
+    subtitle?: string;
+};
+type CreatedElement = {
+    elementId: string;
+    model: V1ElementModelProps;
+    createParams: CreateElementParams;
+};
+type CreatedElementsResult = {
+    createdElements: CreatedElement[];
+};
+
+declare const createElements: ({ elements, title, subtitle, }: CreateNestedElementsParams) => CreatedElementsResult;
 
 type Options = {
     useHistory?: boolean;
+    at?: number;
 };
 declare function deleteElement({ elementId, options }: {
     elementId: string;
     options?: Options;
 }): void;
 
+type RemoveNestedElementsParams = {
+    elementIds: string[];
+    title: string;
+    subtitle?: string;
+};
+type RemovedElement = {
+    elementId: string;
+    model: V1ElementModelProps;
+    parent: V1Element | null;
+    at: number;
+};
+type RemovedElementsResult = {
+    elementIds: string[];
+    removedElements: RemovedElement[];
+};
+
+declare const removeElements: ({ elementIds, title, subtitle, }: RemoveNestedElementsParams) => RemovedElementsResult;
+
 declare function getContainer(id: string): V1Element | null;
 declare const selectElement: (elementId: string) => void;
 
@@ -144,6 +185,8 @@ type UpdateElementSettingsArgs = {
 };
 declare const updateElementSettings: ({ id, props, withHistory }: UpdateElementSettingsArgs) => void;
 
+declare const generateElementId: () => string;
+
 declare const ELEMENT_STYLE_CHANGE_EVENT = "elementor/editor-v2/editor-elements/style";
 declare const styleRerenderEvents: (_elementor_editor_v1_adapters.CommandEventDescriptor | _elementor_editor_v1_adapters.WindowEventDescriptor)[];
 
@@ -188,4 +231,4 @@ declare function getAnchoredDescendantId(elementId: string): string | null;
 declare function getAnchoredAncestorId(elementId: string): string | null;
 declare function isElementAnchored(elementId: string): boolean;
 
-export { type Control, type ControlItem, type ControlLayout, type ControlsSection, type CreateElementStyleArgs, ELEMENT_STYLE_CHANGE_EVENT, type Element, type ElementChildren, type ElementID, type ElementType, type LinkInLinkRestriction, type UpdateElementSettingsArgs, type UpdateElementStyleArgs, type V1Element, type V1ElementConfig, type V1ElementModelProps, type V1ElementSettingsProps, createElement, createElementStyle, deleteElement, deleteElementStyle, getAnchoredAncestorId, getAnchoredDescendantId, getContainer, getCurrentDocumentId, getElementLabel, getElementSetting, getElementSettings, getElementStyles, getElements, getLinkInLinkRestriction, getSelectedElements, getWidgetsCache, isElementAnchored, selectElement, shouldCreateNewLocalStyle, styleRerenderEvents, updateElementSettings, updateElementStyle, useElementChildren, useElementSetting, useElementSettings, useElementType, useParentElement, useSelectedElement };
+export { type Control, type ControlItem, type ControlLayout, type ControlsSection, type CreateElementParams, type CreateElementStyleArgs, ELEMENT_STYLE_CHANGE_EVENT, type Element, type ElementChildren, type ElementID, type ElementType, type LinkInLinkRestriction, type UpdateElementSettingsArgs, type UpdateElementStyleArgs, type V1Element, type V1ElementConfig, type V1ElementModelProps, type V1ElementSettingsProps, createElement, createElementStyle, createElements, deleteElement, deleteElementStyle, generateElementId, getAnchoredAncestorId, getAnchoredDescendantId, getContainer, getCurrentDocumentId, getElementLabel, getElementSetting, getElementSettings, getElementStyles, getElements, getLinkInLinkRestriction, getSelectedElements, getWidgetsCache, isElementAnchored, removeElements, selectElement, shouldCreateNewLocalStyle, styleRerenderEvents, updateElementSettings, updateElementStyle, useElementChildren, useElementSetting, useElementSettings, useElementType, useParentElement, useSelectedElement };

package/dist/index.d.ts

@@ -43,9 +43,13 @@ type V1Element = {
     id: string;
     model: V1Model<V1ElementModelProps>;
     settings: V1Model<V1ElementSettingsProps>;
-    children?: V1Element[];
+    children?: V1Element[] & {
+        findRecursive?: (predicate: (child: V1Element) => boolean) => V1Element | undefined;
+        forEachRecursive?: (callback: (child: V1Element) => void) => V1Element[];
+    };
     view?: {
         el?: HTMLElement;
+        _index?: number;
         getDomElement?: () => {
             get?: (index: number) => HTMLElement | undefined;
         };
@@ -102,23 +106,60 @@ declare function useElementChildren<T extends ElementChildren>(elementId: Elemen
 
 type Options$1 = {
     useHistory?: boolean;
+    at?: number;
 };
-declare function createElement({ containerId, settings, type, id, options, }: {
+type CreateElementParams = {
     settings: V1ElementSettingsProps;
     type: string;
     containerId: string;
     id?: string;
     options?: Options$1;
-}): V1Element;
+};
+declare function createElement({ containerId, settings, type, id, options }: CreateElementParams): V1Element;
+
+type CreateNestedElementsParams = {
+    elements: CreateElementParams[];
+    title: string;
+    subtitle?: string;
+};
+type CreatedElement = {
+    elementId: string;
+    model: V1ElementModelProps;
+    createParams: CreateElementParams;
+};
+type CreatedElementsResult = {
+    createdElements: CreatedElement[];
+};
+
+declare const createElements: ({ elements, title, subtitle, }: CreateNestedElementsParams) => CreatedElementsResult;
 
 type Options = {
     useHistory?: boolean;
+    at?: number;
 };
 declare function deleteElement({ elementId, options }: {
     elementId: string;
     options?: Options;
 }): void;
 
+type RemoveNestedElementsParams = {
+    elementIds: string[];
+    title: string;
+    subtitle?: string;
+};
+type RemovedElement = {
+    elementId: string;
+    model: V1ElementModelProps;
+    parent: V1Element | null;
+    at: number;
+};
+type RemovedElementsResult = {
+    elementIds: string[];
+    removedElements: RemovedElement[];
+};
+
+declare const removeElements: ({ elementIds, title, subtitle, }: RemoveNestedElementsParams) => RemovedElementsResult;
+
 declare function getContainer(id: string): V1Element | null;
 declare const selectElement: (elementId: string) => void;
 
@@ -144,6 +185,8 @@ type UpdateElementSettingsArgs = {
 };
 declare const updateElementSettings: ({ id, props, withHistory }: UpdateElementSettingsArgs) => void;
 
+declare const generateElementId: () => string;
+
 declare const ELEMENT_STYLE_CHANGE_EVENT = "elementor/editor-v2/editor-elements/style";
 declare const styleRerenderEvents: (_elementor_editor_v1_adapters.CommandEventDescriptor | _elementor_editor_v1_adapters.WindowEventDescriptor)[];
 
@@ -188,4 +231,4 @@ declare function getAnchoredDescendantId(elementId: string): string | null;
 declare function getAnchoredAncestorId(elementId: string): string | null;
 declare function isElementAnchored(elementId: string): boolean;
 
-export { type Control, type ControlItem, type ControlLayout, type ControlsSection, type CreateElementStyleArgs, ELEMENT_STYLE_CHANGE_EVENT, type Element, type ElementChildren, type ElementID, type ElementType, type LinkInLinkRestriction, type UpdateElementSettingsArgs, type UpdateElementStyleArgs, type V1Element, type V1ElementConfig, type V1ElementModelProps, type V1ElementSettingsProps, createElement, createElementStyle, deleteElement, deleteElementStyle, getAnchoredAncestorId, getAnchoredDescendantId, getContainer, getCurrentDocumentId, getElementLabel, getElementSetting, getElementSettings, getElementStyles, getElements, getLinkInLinkRestriction, getSelectedElements, getWidgetsCache, isElementAnchored, selectElement, shouldCreateNewLocalStyle, styleRerenderEvents, updateElementSettings, updateElementStyle, useElementChildren, useElementSetting, useElementSettings, useElementType, useParentElement, useSelectedElement };
+export { type Control, type ControlItem, type ControlLayout, type ControlsSection, type CreateElementParams, type CreateElementStyleArgs, ELEMENT_STYLE_CHANGE_EVENT, type Element, type ElementChildren, type ElementID, type ElementType, type LinkInLinkRestriction, type UpdateElementSettingsArgs, type UpdateElementStyleArgs, type V1Element, type V1ElementConfig, type V1ElementModelProps, type V1ElementSettingsProps, createElement, createElementStyle, createElements, deleteElement, deleteElementStyle, generateElementId, getAnchoredAncestorId, getAnchoredDescendantId, getContainer, getCurrentDocumentId, getElementLabel, getElementSetting, getElementSettings, getElementStyles, getElements, getLinkInLinkRestriction, getSelectedElements, getWidgetsCache, isElementAnchored, removeElements, selectElement, shouldCreateNewLocalStyle, styleRerenderEvents, updateElementSettings, updateElementStyle, useElementChildren, useElementSetting, useElementSettings, useElementType, useParentElement, useSelectedElement };

package/dist/index.js

@@ -23,8 +23,10 @@ __export(index_exports, {
   ELEMENT_STYLE_CHANGE_EVENT: () => ELEMENT_STYLE_CHANGE_EVENT,
   createElement: () => createElement,
   createElementStyle: () => createElementStyle,
+  createElements: () => createElements,
   deleteElement: () => deleteElement,
   deleteElementStyle: () => deleteElementStyle,
+  generateElementId: () => generateElementId,
   getAnchoredAncestorId: () => getAnchoredAncestorId,
   getAnchoredDescendantId: () => getAnchoredDescendantId,
   getContainer: () => getContainer,
@@ -38,6 +40,7 @@ __export(index_exports, {
   getSelectedElements: () => getSelectedElements,
   getWidgetsCache: () => getWidgetsCache,
   isElementAnchored: () => isElementAnchored,
+  removeElements: () => removeElements,
   selectElement: () => selectElement,
   shouldCreateNewLocalStyle: () => shouldCreateNewLocalStyle,
   styleRerenderEvents: () => styleRerenderEvents,
@@ -209,14 +212,17 @@ function useElementChildren(elementId, childrenTypes) {
     ],
     () => {
       const container = getContainer(elementId);
-      const children = container?.children || [];
-      return childrenTypes.reduce((acc, type) => {
-        const childElements = children.filter((child) => child.model?.get("widgetType") === type).map((child) => ({ id: child.id }));
-        if (childElements) {
-          acc[type] = childElements;
-        }
+      const elementChildren = childrenTypes.reduce((acc, type) => {
+        acc[type] = [];
         return acc;
       }, {});
+      container?.children?.forEachRecursive?.(({ model, id }) => {
+        const widgetType = model.get("widgetType");
+        if (widgetType && widgetType in elementChildren) {
+          elementChildren[widgetType].push({ id });
+        }
+      });
+      return elementChildren;
     },
     [elementId]
   );
@@ -224,13 +230,7 @@ function useElementChildren(elementId, childrenTypes) {
 
 // src/sync/create-element.ts
 var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
-function createElement({
-  containerId,
-  settings,
-  type,
-  id,
-  options
-}) {
+function createElement({ containerId, settings, type, id, options }) {
   const container = getContainer(containerId);
   const model = createElementModel({ settings, type, id });
   if (!container) {
@@ -253,9 +253,13 @@ function createElementModel({ settings, type, id }) {
   };
 }
 
+// src/sync/create-elements.ts
+var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
+var import_i18n = require("@wordpress/i18n");
+
 // src/sync/delete-element.ts
 var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
-function deleteElement({ elementId, options }) {
+function deleteElement({ elementId, options = {} }) {
   const container = getContainer(elementId);
   if (!container) {
     throw new Error(`Element with ID "${elementId}" not found`);
@@ -266,6 +270,135 @@ function deleteElement({ elementId, options }) {
   });
 }
 
+// src/sync/create-elements.ts
+var createElements = ({
+  elements,
+  title,
+  subtitle = (0, import_i18n.__)("Item added", "elementor")
+}) => {
+  const undoableCreate = (0, import_editor_v1_adapters9.undoable)(
+    {
+      do: ({ elements: elementsParam }) => {
+        const createdElements = [];
+        elementsParam.forEach((createParams) => {
+          const { options, ...elementParams } = createParams;
+          const element = createElement({
+            ...elementParams,
+            options: { ...options, useHistory: false }
+          });
+          const elementId = element.id;
+          createdElements.push({
+            elementId,
+            model: element.model?.toJSON() || {},
+            createParams: {
+              ...createParams,
+              id: elementId
+            }
+          });
+        });
+        return { createdElements };
+      },
+      undo: (_, { createdElements }) => {
+        [...createdElements].reverse().forEach(({ elementId }) => {
+          deleteElement({
+            elementId,
+            options: { useHistory: false }
+          });
+        });
+      },
+      redo: (_, { createdElements }) => {
+        const newElements = [];
+        createdElements.forEach(({ createParams }) => {
+          const element = createElement({
+            ...createParams,
+            options: { ...createParams.options, useHistory: false }
+          });
+          const elementId = element.id;
+          const container = getContainer(elementId);
+          if (container) {
+            newElements.push({
+              elementId,
+              model: container.model.toJSON(),
+              createParams
+            });
+          }
+        });
+        return { createdElements: newElements };
+      }
+    },
+    {
+      title,
+      subtitle
+    }
+  );
+  return undoableCreate({ elements });
+};
+
+// src/sync/remove-elements.ts
+var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
+var import_i18n2 = require("@wordpress/i18n");
+var removeElements = ({
+  elementIds,
+  title,
+  subtitle = (0, import_i18n2.__)("Item removed", "elementor")
+}) => {
+  const undoableRemove = (0, import_editor_v1_adapters10.undoable)(
+    {
+      do: ({ elementIds: elementIdsParam }) => {
+        const removedElements = [];
+        elementIdsParam.forEach((elementId) => {
+          const container = getContainer(elementId);
+          if (container) {
+            const model = container.model.toJSON();
+            const parent = container.parent;
+            const at = container.view?._index ?? 0;
+            removedElements.push({
+              elementId,
+              model,
+              parent: parent ?? null,
+              at
+            });
+          }
+        });
+        elementIdsParam.forEach((elementId) => {
+          deleteElement({
+            elementId,
+            options: { useHistory: false }
+          });
+        });
+        return { elementIds: elementIdsParam, removedElements };
+      },
+      undo: (_, { removedElements }) => {
+        [...removedElements].reverse().forEach(({ model, parent, at }) => {
+          if (parent && model) {
+            createElement({
+              containerId: parent.id,
+              settings: model.settings || {},
+              type: model.widgetType || model.elType,
+              id: model.id,
+              options: { useHistory: false, at }
+            });
+          }
+        });
+      },
+      redo: (_, { elementIds: originalElementIds, removedElements }) => {
+        originalElementIds.forEach((elementId) => {
+          deleteElement({
+            elementId,
+            options: { useHistory: false }
+          });
+        });
+        return { elementIds: originalElementIds, removedElements };
+      }
+    },
+    {
+      title,
+      subtitle
+    }
+  );
+  return undoableRemove({ elementIds });
+};
+
 // src/sync/get-element-styles.ts
 var getElementStyles = (elementID) => {
   const container = getContainer(elementID);
@@ -330,7 +463,7 @@ function getCurrentDocumentId() {
 }
 
 // src/sync/update-element-settings.ts
-var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
 var updateElementSettings = ({ id, props, withHistory = true }) => {
   const container = getContainer(id);
   const args = {
@@ -338,21 +471,27 @@ var updateElementSettings = ({ id, props, withHistory = true }) => {
     settings: { ...props }
   };
   if (withHistory) {
-    (0, import_editor_v1_adapters9.__privateRunCommandSync)("document/elements/settings", args);
+    (0, import_editor_v1_adapters11.__privateRunCommandSync)("document/elements/settings", args);
   } else {
-    (0, import_editor_v1_adapters9.__privateRunCommandSync)("document/elements/set-settings", args, { internal: true });
+    (0, import_editor_v1_adapters11.__privateRunCommandSync)("document/elements/set-settings", args, { internal: true });
   }
 };
 
+// src/sync/generate-element-id.ts
+var generateElementId = () => {
+  const extendedWindow = window;
+  return extendedWindow.elementorCommon?.helpers?.getUniqueId?.() ?? `el-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
+};
+
 // src/styles/consts.ts
-var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters12 = require("@elementor/editor-v1-adapters");
 var ELEMENT_STYLE_CHANGE_EVENT = "elementor/editor-v2/editor-elements/style";
 var styleRerenderEvents = [
-  (0, import_editor_v1_adapters10.commandEndEvent)("document/elements/create"),
-  (0, import_editor_v1_adapters10.commandEndEvent)("document/elements/duplicate"),
-  (0, import_editor_v1_adapters10.commandEndEvent)("document/elements/import"),
-  (0, import_editor_v1_adapters10.commandEndEvent)("document/elements/paste"),
-  (0, import_editor_v1_adapters10.windowEvent)(ELEMENT_STYLE_CHANGE_EVENT)
+  (0, import_editor_v1_adapters12.commandEndEvent)("document/elements/create"),
+  (0, import_editor_v1_adapters12.commandEndEvent)("document/elements/duplicate"),
+  (0, import_editor_v1_adapters12.commandEndEvent)("document/elements/import"),
+  (0, import_editor_v1_adapters12.commandEndEvent)("document/elements/paste"),
+  (0, import_editor_v1_adapters12.windowEvent)(ELEMENT_STYLE_CHANGE_EVENT)
 ];
 
 // src/styles/create-element-style.ts
@@ -361,7 +500,7 @@ var import_editor_styles = require("@elementor/editor-styles");
 
 // src/styles/mutate-element-styles.ts
 var import_editor_props = require("@elementor/editor-props");
-var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters13 = require("@elementor/editor-v1-adapters");
 function mutateElementStyles(elementId, mutator) {
   const container = getContainer(elementId);
   if (!container) {
@@ -417,7 +556,7 @@ function getClassesProps(container) {
 }
 function notifyChanges() {
   dispatchChangeEvent();
-  (0, import_editor_v1_adapters11.__privateRunCommandSync)("document/save/set-is-modified", { status: true }, { internal: true });
+  (0, import_editor_v1_adapters13.__privateRunCommandSync)("document/save/set-is-modified", { status: true }, { internal: true });
 }
 function dispatchChangeEvent() {
   window.dispatchEvent(new CustomEvent(ELEMENT_STYLE_CHANGE_EVENT));
@@ -586,8 +725,10 @@ function isElementorElement(element) {
   ELEMENT_STYLE_CHANGE_EVENT,
   createElement,
   createElementStyle,
+  createElements,
   deleteElement,
   deleteElementStyle,
+  generateElementId,
   getAnchoredAncestorId,
   getAnchoredDescendantId,
   getContainer,
@@ -601,6 +742,7 @@ function isElementorElement(element) {
   getSelectedElements,
   getWidgetsCache,
   isElementAnchored,
+  removeElements,
   selectElement,
   shouldCreateNewLocalStyle,
   styleRerenderEvents,