@elementor/editor-controls 3.32.0-73 → 3.32.0-74

package/dist/index.d.mts

@@ -156,12 +156,12 @@ type Props$2<TMultiPropType extends string, TPropValue extends MultiSizePropValu
 };
 declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React$1.JSX.Element;
 
-declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedOptions, min, }: {
+declare const LinkedDimensionsControl: ({ label, isSiteRtl, extendedOptions, min, }: {
     label: string;
     isSiteRtl?: boolean;
     extendedOptions?: ExtendedOption[];
     min?: number;
-}) => React$1.JSX.Element>;
+}) => React$1.JSX.Element;
 
 type FontCategory = {
     label: string;
@@ -219,9 +219,9 @@ type Props$1 = ControlProps<{
 }>;
 declare const LinkControl: ControlComponent<(props: Props$1) => React$1.JSX.Element>;
 
-declare const GapControl: ControlComponent<({ label }: {
+declare const GapControl: ({ label }: {
     label: string;
-}) => React$1.JSX.Element>;
+}) => React$1.JSX.Element;
 
 declare const AspectRatioControl: ControlComponent<({ label }: {
     label: string;

package/dist/index.d.ts

@@ -156,12 +156,12 @@ type Props$2<TMultiPropType extends string, TPropValue extends MultiSizePropValu
 };
 declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React$1.JSX.Element;
 
-declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedOptions, min, }: {
+declare const LinkedDimensionsControl: ({ label, isSiteRtl, extendedOptions, min, }: {
     label: string;
     isSiteRtl?: boolean;
     extendedOptions?: ExtendedOption[];
     min?: number;
-}) => React$1.JSX.Element>;
+}) => React$1.JSX.Element;
 
 type FontCategory = {
     label: string;
@@ -219,9 +219,9 @@ type Props$1 = ControlProps<{
 }>;
 declare const LinkControl: ControlComponent<(props: Props$1) => React$1.JSX.Element>;
 
-declare const GapControl: ControlComponent<({ label }: {
+declare const GapControl: ({ label }: {
     label: string;
-}) => React$1.JSX.Element>;
+}) => React$1.JSX.Element;
 
 declare const AspectRatioControl: ControlComponent<({ label }: {
     label: string;

package/dist/index.js

@@ -2347,85 +2347,83 @@ var import_editor_props17 = require("@elementor/editor-props");
 var import_icons7 = require("@elementor/icons");
 var import_ui30 = require("@elementor/ui");
 var import_i18n10 = require("@wordpress/i18n");
-var LinkedDimensionsControl = createControl(
-  ({
-    label,
-    isSiteRtl = false,
-    extendedOptions,
-    min
-  }) => {
-    const {
-      value: sizeValue,
-      setValue: setSizeValue,
-      disabled: sizeDisabled,
-      placeholder: sizePlaceholder
-    } = useBoundProp(import_editor_props17.sizePropTypeUtil);
-    const gridRowRefs = [(0, import_react23.useRef)(null), (0, import_react23.useRef)(null)];
-    const {
+var LinkedDimensionsControl = ({
+  label,
+  isSiteRtl = false,
+  extendedOptions,
+  min
+}) => {
+  const {
+    value: sizeValue,
+    setValue: setSizeValue,
+    disabled: sizeDisabled,
+    placeholder: sizePlaceholder
+  } = useBoundProp(import_editor_props17.sizePropTypeUtil);
+  const gridRowRefs = [(0, import_react23.useRef)(null), (0, import_react23.useRef)(null)];
+  const {
+    value: dimensionsValue,
+    setValue: setDimensionsValue,
+    propType,
+    placeholder: dimensionsPlaceholder,
+    disabled: dimensionsDisabled
+  } = useBoundProp(import_editor_props17.dimensionsPropTypeUtil);
+  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);
+      return;
+    }
+    const value = sizeValue ? import_editor_props17.sizePropTypeUtil.create(sizeValue) : null;
+    setDimensionsValue({
+      "block-start": value,
+      "block-end": value,
+      "inline-start": value,
+      "inline-end": value
+    });
+  };
+  const tooltipLabel = label.toLowerCase();
+  const LinkedIcon = isLinked ? import_icons7.LinkIcon : import_icons7.DetachIcon;
+  const linkedLabel = (0, import_i18n10.__)("Link %s", "elementor").replace("%s", tooltipLabel);
+  const unlinkedLabel = (0, import_i18n10.__)("Unlink %s", "elementor").replace("%s", tooltipLabel);
+  const disabled = sizeDisabled || dimensionsDisabled;
+  return /* @__PURE__ */ React38.createElement(
+    PropProvider,
+    {
+      propType,
       value: dimensionsValue,
       setValue: setDimensionsValue,
-      propType,
       placeholder: dimensionsPlaceholder,
-      disabled: dimensionsDisabled
-    } = useBoundProp(import_editor_props17.dimensionsPropTypeUtil);
-    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);
-        return;
-      }
-      const value = sizeValue ? import_editor_props17.sizePropTypeUtil.create(sizeValue) : null;
-      setDimensionsValue({
-        "block-start": value,
-        "block-end": value,
-        "inline-start": value,
-        "inline-end": value
-      });
-    };
-    const tooltipLabel = label.toLowerCase();
-    const LinkedIcon = isLinked ? import_icons7.LinkIcon : import_icons7.DetachIcon;
-    const linkedLabel = (0, import_i18n10.__)("Link %s", "elementor").replace("%s", tooltipLabel);
-    const unlinkedLabel = (0, import_i18n10.__)("Unlink %s", "elementor").replace("%s", tooltipLabel);
-    const disabled = sizeDisabled || dimensionsDisabled;
-    return /* @__PURE__ */ React38.createElement(
-      PropProvider,
+      isDisabled: () => disabled
+    },
+    /* @__PURE__ */ React38.createElement(import_ui30.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React38.createElement(ControlFormLabel, null, label), /* @__PURE__ */ React38.createElement(import_ui30.Tooltip, { title: isLinked ? unlinkedLabel : linkedLabel, placement: "top" }, /* @__PURE__ */ React38.createElement(
+      StyledToggleButton,
       {
-        propType,
-        value: dimensionsValue,
-        setValue: setDimensionsValue,
-        placeholder: dimensionsPlaceholder,
-        isDisabled: () => disabled
+        "aria-label": isLinked ? unlinkedLabel : linkedLabel,
+        size: "tiny",
+        value: "check",
+        selected: isLinked,
+        sx: { marginLeft: "auto" },
+        onChange: onLinkToggle,
+        disabled,
+        isPlaceholder: hasPlaceholders
       },
-      /* @__PURE__ */ React38.createElement(import_ui30.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React38.createElement(ControlFormLabel, null, label), /* @__PURE__ */ React38.createElement(import_ui30.Tooltip, { title: isLinked ? unlinkedLabel : linkedLabel, placement: "top" }, /* @__PURE__ */ React38.createElement(
-        StyledToggleButton,
-        {
-          "aria-label": isLinked ? unlinkedLabel : linkedLabel,
-          size: "tiny",
-          value: "check",
-          selected: isLinked,
-          sx: { marginLeft: "auto" },
-          onChange: onLinkToggle,
-          disabled,
-          isPlaceholder: hasPlaceholders
-        },
-        /* @__PURE__ */ React38.createElement(LinkedIcon, { fontSize: "tiny" })
-      ))),
-      getCssDimensionProps(isSiteRtl).map((row, index) => /* @__PURE__ */ React38.createElement(import_ui30.Stack, { direction: "row", gap: 2, flexWrap: "nowrap", key: index, ref: gridRowRefs[index] }, row.map(({ icon, ...props }) => /* @__PURE__ */ React38.createElement(import_ui30.Grid, { container: true, gap: 0.75, alignItems: "center", key: props.bind }, /* @__PURE__ */ React38.createElement(import_ui30.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React38.createElement(Label, { ...props })), /* @__PURE__ */ React38.createElement(import_ui30.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React38.createElement(
-        Control3,
-        {
-          bind: props.bind,
-          startIcon: icon,
-          isLinked,
-          extendedOptions,
-          anchorRef: gridRowRefs[index],
-          min
-        }
-      ))))))
-    );
-  }
-);
+      /* @__PURE__ */ React38.createElement(LinkedIcon, { fontSize: "tiny" })
+    ))),
+    getCssDimensionProps(isSiteRtl).map((row, index) => /* @__PURE__ */ React38.createElement(import_ui30.Stack, { direction: "row", gap: 2, flexWrap: "nowrap", key: index, ref: gridRowRefs[index] }, row.map(({ icon, ...props }) => /* @__PURE__ */ React38.createElement(import_ui30.Grid, { container: true, gap: 0.75, alignItems: "center", key: props.bind }, /* @__PURE__ */ React38.createElement(import_ui30.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React38.createElement(Label, { ...props })), /* @__PURE__ */ React38.createElement(import_ui30.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React38.createElement(
+      Control3,
+      {
+        bind: props.bind,
+        startIcon: icon,
+        isLinked,
+        extendedOptions,
+        anchorRef: gridRowRefs[index],
+        min
+      }
+    ))))))
+  );
+};
 var Control3 = ({
   bind,
   startIcon,
@@ -3074,7 +3072,7 @@ var import_editor_props22 = require("@elementor/editor-props");
 var import_icons12 = require("@elementor/icons");
 var import_ui38 = require("@elementor/ui");
 var import_i18n15 = require("@wordpress/i18n");
-var GapControl = createControl(({ label }) => {
+var GapControl = ({ label }) => {
   const {
     value: directionValue,
     setValue: setDirectionValue,
@@ -3113,7 +3111,7 @@ var GapControl = createControl(({ label }) => {
     },
     /* @__PURE__ */ React46.createElement(LinkedIcon, { fontSize: "tiny" })
   ))), /* @__PURE__ */ React46.createElement(import_ui38.Stack, { direction: "row", gap: 2, flexWrap: "nowrap", ref: stackRef }, /* @__PURE__ */ React46.createElement(import_ui38.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React46.createElement(import_ui38.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React46.createElement(ControlFormLabel, null, (0, import_i18n15.__)("Column", "elementor"))), /* @__PURE__ */ React46.createElement(import_ui38.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React46.createElement(Control4, { bind: "column", isLinked, anchorRef: stackRef }))), /* @__PURE__ */ React46.createElement(import_ui38.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React46.createElement(import_ui38.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React46.createElement(ControlFormLabel, null, (0, import_i18n15.__)("Row", "elementor"))), /* @__PURE__ */ React46.createElement(import_ui38.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React46.createElement(Control4, { bind: "row", isLinked, anchorRef: stackRef })))));
-});
+};
 var Control4 = ({
   bind,
   isLinked,