@elementor/editor-editing-panel 3.33.0-202 → 3.33.0-204

package/dist/index.d.mts

@@ -380,7 +380,7 @@ declare const controlTypes: {
         };
     };
     readonly size: {
-        readonly component: ControlComponent<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, min, enablePropTypeUnits, id, ariaLabel, }: Omit<({
+        readonly component: ControlComponent<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, min, enablePropTypeUnits, id, ariaLabel, isRepeaterControl, }: Omit<({
             placeholder?: string;
             startIcon?: react.ReactNode;
             extendedOptions?: _elementor_editor_controls.ExtendedOption[];
@@ -390,6 +390,7 @@ declare const controlTypes: {
             enablePropTypeUnits?: boolean;
             id?: string;
             ariaLabel?: string;
+            isRepeaterControl?: boolean;
         } & {
             units?: ("em" | "px" | "%" | "rem" | "vw" | "vh")[] | undefined;
             defaultUnit?: "em" | "px" | "%" | "rem" | "vw" | "vh" | undefined;
@@ -405,6 +406,7 @@ declare const controlTypes: {
             enablePropTypeUnits?: boolean;
             id?: string;
             ariaLabel?: string;
+            isRepeaterControl?: boolean;
         } & {
             units?: ("deg" | "rad" | "grad" | "turn")[] | undefined;
             defaultUnit?: "deg" | "rad" | "grad" | "turn" | undefined;
@@ -420,6 +422,7 @@ declare const controlTypes: {
             enablePropTypeUnits?: boolean;
             id?: string;
             ariaLabel?: string;
+            isRepeaterControl?: boolean;
         } & {
             units?: ("s" | "ms")[] | undefined;
             defaultUnit?: "s" | "ms" | undefined;

package/dist/index.d.ts

@@ -380,7 +380,7 @@ declare const controlTypes: {
         };
     };
     readonly size: {
-        readonly component: ControlComponent<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, min, enablePropTypeUnits, id, ariaLabel, }: Omit<({
+        readonly component: ControlComponent<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, min, enablePropTypeUnits, id, ariaLabel, isRepeaterControl, }: Omit<({
             placeholder?: string;
             startIcon?: react.ReactNode;
             extendedOptions?: _elementor_editor_controls.ExtendedOption[];
@@ -390,6 +390,7 @@ declare const controlTypes: {
             enablePropTypeUnits?: boolean;
             id?: string;
             ariaLabel?: string;
+            isRepeaterControl?: boolean;
         } & {
             units?: ("em" | "px" | "%" | "rem" | "vw" | "vh")[] | undefined;
             defaultUnit?: "em" | "px" | "%" | "rem" | "vw" | "vh" | undefined;
@@ -405,6 +406,7 @@ declare const controlTypes: {
             enablePropTypeUnits?: boolean;
             id?: string;
             ariaLabel?: string;
+            isRepeaterControl?: boolean;
         } & {
             units?: ("deg" | "rad" | "grad" | "turn")[] | undefined;
             defaultUnit?: "deg" | "rad" | "grad" | "turn" | undefined;
@@ -420,6 +422,7 @@ declare const controlTypes: {
             enablePropTypeUnits?: boolean;
             id?: string;
             ariaLabel?: string;
+            isRepeaterControl?: boolean;
         } & {
             units?: ("s" | "ms")[] | undefined;
             defaultUnit?: "s" | "ms" | undefined;

package/dist/index.js

@@ -4841,11 +4841,21 @@ var StyledContainer = (0, import_ui42.styled)(import_ui42.Box, {
 }));
 var getGridLayout = (layout) => ({
   justifyContent: "space-between",
-  gridTemplateColumns: {
-    full: "minmax(0, 1fr)",
-    "two-columns": "repeat(2, minmax(0, 1fr))"
-  }[layout]
+  ...getStyleByLayout(layout)
 });
+var getStyleByLayout = (layout) => {
+  if (layout === "full") {
+    return {
+      gridTemplateColumns: "minmax(0, 1fr)"
+    };
+  }
+  if (layout === "two-columns") {
+    return {
+      alignItems: "center",
+      gridTemplateColumns: "repeat(2, minmax(0, 1fr))"
+    };
+  }
+};
 
 // src/controls-registry/settings-field.tsx
 var React87 = __toESM(require("react"));
@@ -5257,31 +5267,31 @@ var import_editor_elements16 = require("@elementor/editor-elements");
 var import_editor_props16 = require("@elementor/editor-props");
 var import_i18n63 = require("@wordpress/i18n");
 var TAB_ELEMENT_TYPE = "e-tab";
-var TAB_PANEL_ELEMENT_TYPE = "e-tab-panel";
+var TAB_CONTENT_ELEMENT_TYPE = "e-tab-content";
 var duplicateItem = ({ items: items3 }) => {
   items3.forEach(({ item }) => {
     const tabId = item.id;
-    const { value: tabPanelId } = (0, import_editor_elements16.getElementSetting)(tabId, "tab-panel-id") ?? {};
-    if (!tabPanelId) {
-      throw new Error("Original panel ID is required for duplication");
+    const { value: tabContentId } = (0, import_editor_elements16.getElementSetting)(tabId, "tab-content-id") ?? {};
+    if (!tabContentId) {
+      throw new Error("Original content ID is required for duplication");
     }
     (0, import_editor_elements16.duplicateElements)({
-      elementIds: [tabId, tabPanelId],
+      elementIds: [tabId, tabContentId],
       title: (0, import_i18n63.__)("Duplicate Tab", "elementor"),
       onCreate: (duplicatedElements) => {
         const tab = duplicatedElements.find((element) => element.originalElementId === tabId);
-        const tabPanel = duplicatedElements.find((element) => element.originalElementId === tabPanelId);
-        if (tabPanel && tab) {
+        const tabContent = duplicatedElements.find((element) => element.originalElementId === tabContentId);
+        if (tabContent && tab) {
           (0, import_editor_elements16.updateElementSettings)({
             withHistory: false,
             id: tab.id,
             props: {
-              "tab-panel-id": import_editor_props16.stringPropTypeUtil.create(tabPanel.id)
+              "tab-content-id": import_editor_props16.stringPropTypeUtil.create(tabContent.id)
             }
           });
           (0, import_editor_elements16.updateElementSettings)({
             withHistory: false,
-            id: tabPanel.id,
+            id: tabContent.id,
             props: {
               "tab-id": import_editor_props16.stringPropTypeUtil.create(tab.id)
             }
@@ -5293,12 +5303,12 @@ var duplicateItem = ({ items: items3 }) => {
 };
 var moveItem = ({
   toIndex,
-  tabListId,
-  tabContentId,
+  tabsMenuId,
+  tabContentAreaId,
   movedElementId
 }) => {
-  const { value: tabPanelId } = (0, import_editor_elements16.getElementSetting)(movedElementId, "tab-panel-id") ?? {};
-  if (!tabPanelId) {
+  const { value: tabContentId } = (0, import_editor_elements16.getElementSetting)(movedElementId, "tab-content-id") ?? {};
+  if (!tabContentId) {
     throw new Error("Required tab elements not found for reordering");
   }
   (0, import_editor_elements16.moveElements)({
@@ -5306,12 +5316,12 @@ var moveItem = ({
     moves: [
       {
         elementId: movedElementId,
-        targetContainerId: tabListId,
+        targetContainerId: tabsMenuId,
         options: { at: toIndex }
       },
       {
-        elementId: tabPanelId,
-        targetContainerId: tabContentId,
+        elementId: tabContentId,
+        targetContainerId: tabContentAreaId,
         options: { at: toIndex }
       }
     ]
@@ -5322,46 +5332,46 @@ var removeItem = ({ items: items3 }) => {
     title: (0, import_i18n63.__)("Tabs", "elementor"),
     elementIds: items3.flatMap(({ item }) => {
       const tabId = item.id;
-      const { value: panelId } = (0, import_editor_elements16.getElementSetting)(tabId, "tab-panel-id") ?? {};
-      if (!panelId) {
-        throw new Error("Pane ID is required");
+      const { value: tabContentId } = (0, import_editor_elements16.getElementSetting)(tabId, "tab-content-id") ?? {};
+      if (!tabContentId) {
+        throw new Error("Content ID is required");
       }
-      return [tabId, panelId];
+      return [tabId, tabContentId];
     })
   });
 };
 var addItem = ({
-  tabContentId,
-  tabListId,
+  tabContentAreaId,
+  tabsMenuId,
   items: items3
 }) => {
   items3.forEach(({ item, index }) => {
-    const newTabPanelId = (0, import_editor_elements16.generateElementId)();
+    const newTabContentId = (0, import_editor_elements16.generateElementId)();
     const newTabId = (0, import_editor_elements16.generateElementId)();
     (0, import_editor_elements16.createElements)({
       title: (0, import_i18n63.__)("Tabs", "elementor"),
       elements: [
         {
-          containerId: tabContentId,
+          containerId: tabContentAreaId,
           model: {
-            id: newTabPanelId,
-            elType: TAB_PANEL_ELEMENT_TYPE,
+            id: newTabContentId,
+            elType: TAB_CONTENT_ELEMENT_TYPE,
             settings: {
               "tab-id": import_editor_props16.stringPropTypeUtil.create(newTabId)
             },
-            editor_settings: { title: `Tab ${index + 1} panel` }
+            editor_settings: { title: `Tab ${index + 1} content` }
           }
         },
         {
-          containerId: tabListId,
+          containerId: tabsMenuId,
           model: {
             id: newTabId,
             elType: TAB_ELEMENT_TYPE,
             settings: {
               ...item,
-              "tab-panel-id": import_editor_props16.stringPropTypeUtil.create(newTabPanelId)
+              "tab-content-id": import_editor_props16.stringPropTypeUtil.create(newTabContentId)
             },
-            editor_settings: { title: `Tab ${index + 1}` }
+            editor_settings: { title: `Tab ${index + 1} trigger` }
           }
         }
       ]
@@ -5370,16 +5380,16 @@ var addItem = ({
 };
 
 // src/controls-registry/element-controls/tabs-control/tabs-control.tsx
-var TAB_LIST_ELEMENT_TYPE = "e-tabs-list";
-var TAB_CONTENT_ELEMENT_TYPE = "e-tabs-content";
+var TAB_MENU_ELEMENT_TYPE = "e-tabs-menu";
+var TAB_CONTENT_AREA_ELEMENT_TYPE = "e-tabs-content-area";
 var TabsControl = ({ label }) => {
   const { element } = useElement();
   const { [TAB_ELEMENT_TYPE]: tabLinks } = (0, import_editor_elements17.useElementChildren)(element.id, [
     TAB_ELEMENT_TYPE,
-    TAB_PANEL_ELEMENT_TYPE
+    TAB_CONTENT_ELEMENT_TYPE
   ]);
-  const tabList = getElementByType(element.id, TAB_LIST_ELEMENT_TYPE);
-  const tabContent = getElementByType(element.id, TAB_CONTENT_ELEMENT_TYPE);
+  const tabList = getElementByType(element.id, TAB_MENU_ELEMENT_TYPE);
+  const tabContentArea = getElementByType(element.id, TAB_CONTENT_AREA_ELEMENT_TYPE);
   const repeaterValues = tabLinks.map((tabLink) => {
     const { title: titleSetting } = (0, import_editor_elements17.getElementEditorSettings)(tabLink.id) ?? {};
     return {
@@ -5390,7 +5400,7 @@ var TabsControl = ({ label }) => {
   const setValue = (_newValues, _options, meta) => {
     if (meta?.action?.type === "add") {
       const items3 = meta.action.payload;
-      return addItem({ tabContentId: tabContent.id, items: items3, tabListId: tabList.id });
+      return addItem({ tabContentAreaId: tabContentArea.id, items: items3, tabsMenuId: tabList.id });
     }
     if (meta?.action?.type === "remove") {
       const items3 = meta.action.payload;
@@ -5404,8 +5414,8 @@ var TabsControl = ({ label }) => {
       const { from, to } = meta.action.payload;
       return moveItem({
         toIndex: to,
-        tabListId: tabList.id,
-        tabContentId: tabContent.id,
+        tabsMenuId: tabList.id,
+        tabContentAreaId: tabContentArea.id,
         movedElementId: tabLinks[from].id
       });
     }