@elementor/editor-components 3.35.0-486 → 3.35.0-488

package/dist/index.js

@@ -3220,23 +3220,18 @@ function countNestedElements(container) {
 }
 
 // src/components/create-component-form/create-component-form.tsx
+var MAX_COMPONENTS = 100;
 function CreateComponentForm() {
   const [element, setElement] = (0, import_react10.useState)(null);
   const [anchorPosition, setAnchorPosition] = (0, import_react10.useState)();
+  const { components } = useComponents();
   const eventData = (0, import_react10.useRef)(null);
   (0, import_react10.useEffect)(() => {
     const OPEN_SAVE_AS_COMPONENT_FORM_EVENT = "elementor/editor/open-save-as-component-form";
     const openPopup = (event) => {
-      const nonAtomicElements = findNonAtomicElementsInElement(event.detail.element);
-      if (nonAtomicElements.length > 0) {
-        (0, import_editor_notifications3.notify)({
-          type: "default",
-          message: (0, import_i18n22.__)(
-            "Components require atomic elements only. Remove widgets to create this component.",
-            "elementor"
-          ),
-          id: "non-atomic-element-save-blocked"
-        });
+      const { shouldOpen, notification } = shouldOpenForm(event.detail.element, components?.length ?? 0);
+      if (!shouldOpen) {
+        (0, import_editor_notifications3.notify)(notification);
         return;
       }
       setElement({ element: event.detail.element, elementLabel: (0, import_editor_elements10.getElementLabel)(event.detail.element.id) });
@@ -3252,7 +3247,7 @@ function CreateComponentForm() {
     return () => {
       window.removeEventListener(OPEN_SAVE_AS_COMPONENT_FORM_EVENT, openPopup);
     };
-  }, []);
+  }, [components?.length]);
   const handleSave = async (values) => {
     try {
       if (!element) {
@@ -3315,6 +3310,37 @@ function CreateComponentForm() {
     )
   ));
 }
+function shouldOpenForm(element, componentsCount) {
+  const nonAtomicElements = findNonAtomicElementsInElement(element);
+  if (nonAtomicElements.length > 0) {
+    return {
+      shouldOpen: false,
+      notification: {
+        type: "default",
+        message: (0, import_i18n22.__)(
+          "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_i18n22.__)(
+          `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,