@elementor/editor-components 4.1.0-691 → 4.1.0-692

package/dist/index.mjs

@@ -924,7 +924,7 @@ var EditModeDialog = ({ lockedBy }) => {
 // src/components/instance-editing-panel/instance-editing-panel.tsx
 import * as React20 from "react";
 import { PencilIcon as PencilIcon2 } from "@elementor/icons";
-import { Box as Box8, Stack as Stack12 } from "@elementor/ui";
+import { Box as Box9, Stack as Stack11 } from "@elementor/ui";
 import { hasProInstalled as hasProInstalled3 } from "@elementor/utils";
 import { __ as __10 } from "@wordpress/i18n";
 
@@ -1428,14 +1428,14 @@ import * as React19 from "react";
 import { ControlAdornmentsProvider } from "@elementor/editor-controls";
 import { getFieldIndicators } from "@elementor/editor-editing-panel";
 import { PanelBody } from "@elementor/editor-panels";
-import { Divider as Divider2, Stack as Stack11 } from "@elementor/ui";
+import { Divider as Divider2, Stack as Stack10 } from "@elementor/ui";
 
 // src/components/instance-editing-panel/override-props-group.tsx
 import * as React18 from "react";
 import { useId } from "react";
 import { useStateByElement } from "@elementor/editor-editing-panel";
 import { CollapseIcon } from "@elementor/editor-ui";
-import { Box as Box7, Collapse, ListItemButton as ListItemButton2, ListItemText, Stack as Stack10 } from "@elementor/ui";
+import { Box as Box8, Collapse, ListItemButton as ListItemButton2, ListItemText, Stack as Stack9 } from "@elementor/ui";
 
 // src/components/instance-editing-panel/override-prop-control.tsx
 import * as React17 from "react";
@@ -1449,6 +1449,7 @@ import {
 import {
   BaseControl,
   controlsRegistry,
+  ControlTypeContainer,
   createTopLevelObjectType,
   ElementProvider,
   isDynamicPropValue,
@@ -1456,7 +1457,7 @@ import {
   useElement
 } from "@elementor/editor-editing-panel";
 import { getElementSettings, getElementType as getElementType2 } from "@elementor/editor-elements";
-import { Stack as Stack9 } from "@elementor/ui";
+import { Box as Box7 } from "@elementor/ui";
 
 // src/hooks/use-controls-by-widget-type.ts
 import { getElementType } from "@elementor/editor-elements";
@@ -1949,7 +1950,7 @@ function OverrideControl({ overridableProp }) {
           return false;
         }
       },
-      /* @__PURE__ */ React17.createElement(PropKeyProvider, { bind: overridableProp.overrideKey }, /* @__PURE__ */ React17.createElement(ControlReplacementsProvider, { replacements: controlReplacements }, /* @__PURE__ */ React17.createElement(Stack9, { direction: "column", gap: 1, mb: 1.5 }, layout !== "custom" && /* @__PURE__ */ React17.createElement(ControlLabel, null, overridableProp.label), /* @__PURE__ */ React17.createElement(OriginalControl, { control, controlProps }))))
+      /* @__PURE__ */ React17.createElement(PropKeyProvider, { bind: overridableProp.overrideKey }, /* @__PURE__ */ React17.createElement(ControlReplacementsProvider, { replacements: controlReplacements }, /* @__PURE__ */ React17.createElement(Box7, { mb: 1.5 }, /* @__PURE__ */ React17.createElement(ControlTypeContainer, { layout }, layout !== "custom" && /* @__PURE__ */ React17.createElement(ControlLabel, null, overridableProp.label), /* @__PURE__ */ React17.createElement(OriginalControl, { control, controlProps })))))
     )))
   );
 }
@@ -2043,7 +2044,7 @@ function OverridePropsGroup({ group }) {
   const labelId = `label-${id}`;
   const contentId = `content-${id}`;
   const title = group.label;
-  return /* @__PURE__ */ React18.createElement(Box7, { "aria-label": `${title} section` }, /* @__PURE__ */ React18.createElement(
+  return /* @__PURE__ */ React18.createElement(Box8, { "aria-label": `${title} section` }, /* @__PURE__ */ React18.createElement(
     ListItemButton2,
     {
       id: labelId,
@@ -2053,7 +2054,7 @@ function OverridePropsGroup({ group }) {
       p: 0,
       sx: { "&:hover": { backgroundColor: "transparent" } }
     },
-    /* @__PURE__ */ React18.createElement(Stack10, { direction: "row", alignItems: "center", justifyItems: "start", flexGrow: 1, gap: 0.5 }, /* @__PURE__ */ React18.createElement(
+    /* @__PURE__ */ React18.createElement(Stack9, { direction: "row", alignItems: "center", justifyItems: "start", flexGrow: 1, gap: 0.5 }, /* @__PURE__ */ React18.createElement(
       ListItemText,
       {
         secondary: title,
@@ -2062,12 +2063,12 @@ function OverridePropsGroup({ group }) {
       }
     )),
     /* @__PURE__ */ React18.createElement(CollapseIcon, { open: isOpen, color: "secondary", fontSize: "tiny" })
-  ), /* @__PURE__ */ React18.createElement(Collapse, { id: contentId, "aria-labelledby": labelId, in: isOpen, timeout: "auto" }, /* @__PURE__ */ React18.createElement(Stack10, { direction: "column", gap: 1, p: 2 }, group.props.map((overrideKey) => /* @__PURE__ */ React18.createElement(OverridePropControl, { key: overrideKey, overrideKey })))));
+  ), /* @__PURE__ */ React18.createElement(Collapse, { id: contentId, "aria-labelledby": labelId, in: isOpen, timeout: "auto" }, /* @__PURE__ */ React18.createElement(Stack9, { direction: "column", gap: 1, p: 2 }, group.props.map((overrideKey) => /* @__PURE__ */ React18.createElement(OverridePropControl, { key: overrideKey, overrideKey })))));
 }
 
 // src/components/instance-editing-panel/instance-panel-body.tsx
 function InstancePanelBody({ groups, isEmpty, emptyState, componentInstanceId }) {
-  return /* @__PURE__ */ React19.createElement(PanelBody, null, /* @__PURE__ */ React19.createElement(ControlAdornmentsProvider, { items: getFieldIndicators("settings") }, isEmpty ? emptyState : /* @__PURE__ */ React19.createElement(Stack11, { direction: "column", alignItems: "stretch" }, groups.map((group) => /* @__PURE__ */ React19.createElement(React19.Fragment, { key: group.id + componentInstanceId }, /* @__PURE__ */ React19.createElement(OverridePropsGroup, { group }), /* @__PURE__ */ React19.createElement(Divider2, null))))));
+  return /* @__PURE__ */ React19.createElement(PanelBody, null, /* @__PURE__ */ React19.createElement(ControlAdornmentsProvider, { items: getFieldIndicators("settings") }, isEmpty ? emptyState : /* @__PURE__ */ React19.createElement(Stack10, { direction: "column", alignItems: "stretch" }, groups.map((group) => /* @__PURE__ */ React19.createElement(React19.Fragment, { key: group.id + componentInstanceId }, /* @__PURE__ */ React19.createElement(OverridePropsGroup, { group }), /* @__PURE__ */ React19.createElement(Divider2, null))))));
 }
 
 // src/components/instance-editing-panel/use-instance-panel-data.ts
@@ -2177,8 +2178,8 @@ function InstanceEditingPanel() {
   }
   const { componentId, component, overrides, overridableProps, groups, isEmpty, componentInstanceId } = data;
   const panelTitle = __10("Edit %s", "elementor").replace("%s", component.name);
-  const actions = /* @__PURE__ */ React20.createElement(Stack12, { direction: "row", gap: 0.5 }, /* @__PURE__ */ React20.createElement(DetachAction, { componentInstanceId, componentId }), canEdit && /* @__PURE__ */ React20.createElement(EditComponentAction, { disabled: true, label: panelTitle, icon: PencilIcon2 }));
-  return /* @__PURE__ */ React20.createElement(Box8, { "data-testid": "instance-editing-panel", sx: { display: "flex", flexDirection: "column", height: "100%" } }, /* @__PURE__ */ React20.createElement(
+  const actions = /* @__PURE__ */ React20.createElement(Stack11, { direction: "row", gap: 0.5 }, /* @__PURE__ */ React20.createElement(DetachAction, { componentInstanceId, componentId }), canEdit && /* @__PURE__ */ React20.createElement(EditComponentAction, { disabled: true, label: panelTitle, icon: PencilIcon2 }));
+  return /* @__PURE__ */ React20.createElement(Box9, { "data-testid": "instance-editing-panel", sx: { display: "flex", flexDirection: "column", height: "100%" } }, /* @__PURE__ */ React20.createElement(
     ComponentInstanceProvider,
     {
       componentId,