@elementor/editor-controls 3.32.0-43 → 3.32.0-45

package/dist/index.js

@@ -1887,7 +1887,7 @@ var StyledToggleButton = (0, import_ui25.styled)(import_ui25.ToggleButton, {
 	${({ theme, isPlaceholder }) => isPlaceholder && `
 		color: ${theme.palette.text.tertiary};
 		background-color: ${theme.palette.mode === "dark" ? "rgba(255,255,255,0.04)" : "rgba(0,0,0,0.02)"};
-		
+
 		&:hover {
 			background-color: ${theme.palette.mode === "dark" ? "rgba(255,255,255,0.08)" : "rgba(0,0,0,0.04)"};
 		}
@@ -2305,15 +2305,23 @@ var LinkedDimensionsControl = createControl(
     isSiteRtl = false,
     extendedOptions
   }) => {
-    const { value: sizeValue, setValue: setSizeValue, disabled: sizeDisabled } = useBoundProp(import_editor_props17.sizePropTypeUtil);
+    const {
+      value: sizeValue,
+      setValue: setSizeValue,
+      disabled: sizeDisabled,
+      placeholder: sizePlaceholder
+    } = useBoundProp(import_editor_props17.sizePropTypeUtil);
     const gridRowRefs = [(0, import_react22.useRef)(null), (0, import_react22.useRef)(null)];
     const {
       value: dimensionsValue,
       setValue: setDimensionsValue,
       propType,
+      placeholder: dimensionsPlaceholder,
       disabled: dimensionsDisabled
     } = useBoundProp(import_editor_props17.dimensionsPropTypeUtil);
-    const isLinked = !dimensionsValue && !sizeValue ? true : !!sizeValue;
+    const hasUserValues = !!(dimensionsValue || sizeValue);
+    const hasPlaceholders = !!(sizePlaceholder || dimensionsPlaceholder);
+    const isLinked = !hasUserValues && !hasPlaceholders || (hasPlaceholders ? !!sizePlaceholder : !!sizeValue);
     const onLinkToggle = () => {
       if (!isLinked) {
         setSizeValue(dimensionsValue["block-start"]?.value ?? null);
@@ -2338,10 +2346,11 @@ var LinkedDimensionsControl = createControl(
         propType,
         value: dimensionsValue,
         setValue: setDimensionsValue,
+        placeholder: dimensionsPlaceholder,
         isDisabled: () => disabled
       },
       /* @__PURE__ */ React37.createElement(import_ui29.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React37.createElement(ControlFormLabel, null, label), /* @__PURE__ */ React37.createElement(import_ui29.Tooltip, { title: isLinked ? unlinkedLabel : linkedLabel, placement: "top" }, /* @__PURE__ */ React37.createElement(
-        import_ui29.ToggleButton,
+        StyledToggleButton,
         {
           "aria-label": isLinked ? unlinkedLabel : linkedLabel,
           size: "tiny",
@@ -2349,7 +2358,8 @@ var LinkedDimensionsControl = createControl(
           selected: isLinked,
           sx: { marginLeft: "auto" },
           onChange: onLinkToggle,
-          disabled
+          disabled,
+          isPlaceholder: hasPlaceholders
         },
         /* @__PURE__ */ React37.createElement(LinkedIcon, { fontSize: "tiny" })
       ))),