@elementor/editor-editing-panel 3.32.0-68 → 3.32.0-70

package/dist/index.d.mts

@@ -382,12 +382,13 @@ declare const controlTypes: {
         };
     };
     readonly size: {
-        readonly component: ControlComponent<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, }: Omit<({
+        readonly component: ControlComponent<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, min, }: Omit<({
             placeholder?: string;
             startIcon?: react.ReactNode;
             extendedOptions?: _elementor_editor_controls.ExtendedOption[];
             disableCustom?: boolean;
             anchorRef?: react.RefObject<HTMLDivElement | null>;
+            min?: number;
         } & {
             units?: ("em" | "px" | "%" | "rem" | "vw" | "vh")[] | undefined;
             defaultUnit?: "em" | "px" | "%" | "rem" | "vw" | "vh" | undefined;
@@ -399,6 +400,7 @@ declare const controlTypes: {
             extendedOptions?: _elementor_editor_controls.ExtendedOption[];
             disableCustom?: boolean;
             anchorRef?: react.RefObject<HTMLDivElement | null>;
+            min?: number;
         } & {
             units?: ("deg" | "rad" | "grad" | "turn")[] | undefined;
             defaultUnit?: "deg" | "rad" | "grad" | "turn" | undefined;
@@ -410,6 +412,7 @@ declare const controlTypes: {
             extendedOptions?: _elementor_editor_controls.ExtendedOption[];
             disableCustom?: boolean;
             anchorRef?: react.RefObject<HTMLDivElement | null>;
+            min?: number;
         } & {
             units?: ("s" | "ms")[] | undefined;
             defaultUnit?: "s" | "ms" | undefined;

package/dist/index.d.ts

@@ -382,12 +382,13 @@ declare const controlTypes: {
         };
     };
     readonly size: {
-        readonly component: ControlComponent<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, }: Omit<({
+        readonly component: ControlComponent<({ variant, defaultUnit, units, placeholder, startIcon, anchorRef, extendedOptions, disableCustom, min, }: Omit<({
             placeholder?: string;
             startIcon?: react.ReactNode;
             extendedOptions?: _elementor_editor_controls.ExtendedOption[];
             disableCustom?: boolean;
             anchorRef?: react.RefObject<HTMLDivElement | null>;
+            min?: number;
         } & {
             units?: ("em" | "px" | "%" | "rem" | "vw" | "vh")[] | undefined;
             defaultUnit?: "em" | "px" | "%" | "rem" | "vw" | "vh" | undefined;
@@ -399,6 +400,7 @@ declare const controlTypes: {
             extendedOptions?: _elementor_editor_controls.ExtendedOption[];
             disableCustom?: boolean;
             anchorRef?: react.RefObject<HTMLDivElement | null>;
+            min?: number;
         } & {
             units?: ("deg" | "rad" | "grad" | "turn")[] | undefined;
             defaultUnit?: "deg" | "rad" | "grad" | "turn" | undefined;
@@ -410,6 +412,7 @@ declare const controlTypes: {
             extendedOptions?: _elementor_editor_controls.ExtendedOption[];
             disableCustom?: boolean;
             anchorRef?: react.RefObject<HTMLDivElement | null>;
+            min?: number;
         } & {
             units?: ("s" | "ms")[] | undefined;
             defaultUnit?: "s" | "ms" | undefined;

package/dist/index.js

@@ -3289,29 +3289,30 @@ var import_editor_elements10 = require("@elementor/editor-elements");
 var import_i18n21 = require("@wordpress/i18n");
 
 // src/utils/get-recently-used-styles.ts
+var import_editor_canvas3 = require("@elementor/editor-canvas");
 var import_editor_elements9 = require("@elementor/editor-elements");
-var quickTransform = (props) => {
-  return Object.entries(props).map(([key, value]) => {
-    if (value && typeof value === "object" && "$$type" in value) {
-      if (value?.$$type === "dimensions") {
-        return Object.keys(value?.value ?? {}).map((nestedKey) => `${key}-${nestedKey}`);
-      }
-      if (Array.isArray(value?.value) && !value?.value?.length) {
-        return [];
-      }
-    }
-    return [key];
-  });
-};
-var getRecentlyUsedList = (elementId) => {
+var import_editor_styles5 = require("@elementor/editor-styles");
+var getRecentlyUsedList = async (elementId) => {
   if (!elementId) {
     return [];
   }
-  const styles = (0, import_editor_elements9.getElementStyles)(elementId);
+  const resolver = (0, import_editor_canvas3.createPropsResolver)({
+    transformers: import_editor_canvas3.styleTransformersRegistry,
+    schema: (0, import_editor_styles5.getStylesSchema)()
+  });
+  const styles = (0, import_editor_elements9.getElementStyles)(elementId) ?? {};
   const styleKeys = Object.keys(styles ?? {});
   const variants = styleKeys.map((key) => styles?.[key]?.variants ?? []);
-  const propList = variants.flat().filter((variant) => variant !== void 0).map((variant) => variant.props);
-  const propSet = new Set(propList.map(quickTransform).flat(2));
+  const resolved = await Promise.all(
+    variants.flat().map(async (variant) => {
+      const result = await resolver({
+        props: variant.props ?? {},
+        schema: (0, import_editor_styles5.getStylesSchema)()
+      });
+      return Object.entries(result).filter(([, value]) => value !== null).map(([key]) => key);
+    })
+  );
+  const propSet = new Set(resolved.flat());
   return Array.from(propSet);
 };
 
@@ -3339,7 +3340,7 @@ var EffectsSection = () => {
     import_editor_controls18.TransitionRepeaterControl,
     {
       currentStyleState: meta.state,
-      recentlyUsedList: getRecentlyUsedList(element?.id)
+      recentlyUsedListGetter: () => getRecentlyUsedList(element?.id ?? "")
     }
   )), /* @__PURE__ */ React46.createElement(PanelDivider, null), /* @__PURE__ */ React46.createElement(StylesField, { bind: "filter", propDisplayName: FILTER_LABEL }, /* @__PURE__ */ React46.createElement(import_editor_controls18.FilterRepeaterControl, null)), /* @__PURE__ */ React46.createElement(PanelDivider, null), /* @__PURE__ */ React46.createElement(StylesField, { bind: "backdrop-filter", propDisplayName: BACKDROP_FILTER_LABEL }, /* @__PURE__ */ React46.createElement(import_editor_controls18.FilterRepeaterControl, { filterPropName: "backdrop-filter" })));
 };
@@ -4101,7 +4102,15 @@ var DimensionField = ({
   side,
   label,
   rowRef
-}) => /* @__PURE__ */ React59.createElement(StylesField, { bind: side, propDisplayName: label }, /* @__PURE__ */ React59.createElement(import_ui39.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React59.createElement(import_ui39.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React59.createElement(ControlLabel, null, label)), /* @__PURE__ */ React59.createElement(import_ui39.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React59.createElement(import_editor_controls30.SizeControl, { startIcon: sideIcons[side], extendedOptions: ["auto"], anchorRef: rowRef }))));
+}) => /* @__PURE__ */ React59.createElement(StylesField, { bind: side, propDisplayName: label }, /* @__PURE__ */ React59.createElement(import_ui39.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React59.createElement(import_ui39.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React59.createElement(ControlLabel, null, label)), /* @__PURE__ */ React59.createElement(import_ui39.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React59.createElement(
+  import_editor_controls30.SizeControl,
+  {
+    startIcon: sideIcons[side],
+    extendedOptions: ["auto"],
+    anchorRef: rowRef,
+    min: -Number.MAX_SAFE_INTEGER
+  }
+))));
 
 // src/components/style-sections/position-section/offset-field.tsx
 var React60 = __toESM(require("react"));
@@ -4371,7 +4380,8 @@ var SpacingSection = () => {
     {
       label: MARGIN_LABEL,
       isSiteRtl,
-      extendedOptions: ["auto"]
+      extendedOptions: ["auto"],
+      min: -Number.MAX_SAFE_INTEGER
     }
   )), /* @__PURE__ */ React69.createElement(PanelDivider, null), /* @__PURE__ */ React69.createElement(StylesField, { bind: "padding", propDisplayName: PADDING_LABEL }, /* @__PURE__ */ React69.createElement(import_editor_controls37.LinkedDimensionsControl, { label: PADDING_LABEL, isSiteRtl })));
 };
@@ -4973,7 +4983,7 @@ var EditingPanelHooks = () => {
 };
 
 // src/dynamics/init.ts
-var import_editor_canvas4 = require("@elementor/editor-canvas");
+var import_editor_canvas5 = require("@elementor/editor-canvas");
 var import_editor_controls60 = require("@elementor/editor-controls");
 
 // src/dynamics/components/background-control-dynamic-tag.tsx
@@ -5337,7 +5347,7 @@ var Control3 = ({ control }) => {
 };
 
 // src/dynamics/dynamic-transformer.ts
-var import_editor_canvas3 = require("@elementor/editor-canvas");
+var import_editor_canvas4 = require("@elementor/editor-canvas");
 var import_editor_props18 = require("@elementor/editor-props");
 
 // src/dynamics/errors.ts
@@ -5348,7 +5358,7 @@ var DynamicTagsManagerNotFoundError = (0, import_utils10.createError)({
 });
 
 // src/dynamics/dynamic-transformer.ts
-var dynamicTransformer = (0, import_editor_canvas3.createTransformer)((value) => {
+var dynamicTransformer = (0, import_editor_canvas4.createTransformer)((value) => {
   if (!value.name) {
     return null;
   }
@@ -5422,8 +5432,8 @@ var init = () => {
     id: "dynamic-tags",
     useProps: usePropDynamicAction
   });
-  import_editor_canvas4.styleTransformersRegistry.register("dynamic", dynamicTransformer);
-  import_editor_canvas4.settingsTransformersRegistry.register("dynamic", dynamicTransformer);
+  import_editor_canvas5.styleTransformersRegistry.register("dynamic", dynamicTransformer);
+  import_editor_canvas5.settingsTransformersRegistry.register("dynamic", dynamicTransformer);
 };
 
 // src/reset-style-props.tsx
@@ -5449,7 +5459,7 @@ function useResetStyleValueProps() {
 }
 
 // src/styles-inheritance/init-styles-inheritance-transformers.ts
-var import_editor_canvas9 = require("@elementor/editor-canvas");
+var import_editor_canvas10 = require("@elementor/editor-canvas");
 
 // src/styles-inheritance/consts.ts
 var excludePropTypeTransformers = /* @__PURE__ */ new Set([
@@ -5467,9 +5477,9 @@ var excludePropTypeTransformers = /* @__PURE__ */ new Set([
 
 // src/styles-inheritance/transformers/background-color-overlay-transformer.tsx
 var React95 = __toESM(require("react"));
-var import_editor_canvas5 = require("@elementor/editor-canvas");
+var import_editor_canvas6 = require("@elementor/editor-canvas");
 var import_ui48 = require("@elementor/ui");
-var backgroundColorOverlayTransformer = (0, import_editor_canvas5.createTransformer)((value) => /* @__PURE__ */ React95.createElement(import_ui48.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React95.createElement(ItemIconColor, { value }), /* @__PURE__ */ React95.createElement(ItemLabelColor, { value })));
+var backgroundColorOverlayTransformer = (0, import_editor_canvas6.createTransformer)((value) => /* @__PURE__ */ React95.createElement(import_ui48.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React95.createElement(ItemIconColor, { value }), /* @__PURE__ */ React95.createElement(ItemLabelColor, { value })));
 var ItemIconColor = ({ value }) => {
   const { color } = value;
   return /* @__PURE__ */ React95.createElement(StyledUnstableColorIndicator, { size: "inherit", component: "span", value: color });
@@ -5487,10 +5497,10 @@ var StyledUnstableColorIndicator = (0, import_ui48.styled)(import_ui48.UnstableC
 
 // src/styles-inheritance/transformers/background-gradient-overlay-transformer.tsx
 var React96 = __toESM(require("react"));
-var import_editor_canvas6 = require("@elementor/editor-canvas");
+var import_editor_canvas7 = require("@elementor/editor-canvas");
 var import_ui49 = require("@elementor/ui");
 var import_i18n66 = require("@wordpress/i18n");
-var backgroundGradientOverlayTransformer = (0, import_editor_canvas6.createTransformer)((value) => /* @__PURE__ */ React96.createElement(import_ui49.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React96.createElement(ItemIconGradient, { value }), /* @__PURE__ */ React96.createElement(ItemLabelGradient, { value })));
+var backgroundGradientOverlayTransformer = (0, import_editor_canvas7.createTransformer)((value) => /* @__PURE__ */ React96.createElement(import_ui49.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React96.createElement(ItemIconGradient, { value }), /* @__PURE__ */ React96.createElement(ItemLabelGradient, { value })));
 var ItemIconGradient = ({ value }) => {
   const gradient = getGradientValue(value);
   return /* @__PURE__ */ React96.createElement(StyledUnstableColorIndicator, { size: "inherit", component: "span", value: gradient });
@@ -5511,11 +5521,11 @@ var getGradientValue = (gradient) => {
 
 // src/styles-inheritance/transformers/background-image-overlay-transformer.tsx
 var React97 = __toESM(require("react"));
-var import_editor_canvas7 = require("@elementor/editor-canvas");
+var import_editor_canvas8 = require("@elementor/editor-canvas");
 var import_editor_ui9 = require("@elementor/editor-ui");
 var import_ui50 = require("@elementor/ui");
 var import_wp_media = require("@elementor/wp-media");
-var backgroundImageOverlayTransformer = (0, import_editor_canvas7.createTransformer)((value) => /* @__PURE__ */ React97.createElement(import_ui50.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React97.createElement(ItemIconImage, { value }), /* @__PURE__ */ React97.createElement(ItemLabelImage, { value })));
+var backgroundImageOverlayTransformer = (0, import_editor_canvas8.createTransformer)((value) => /* @__PURE__ */ React97.createElement(import_ui50.Stack, { direction: "row", gap: 1, alignItems: "center" }, /* @__PURE__ */ React97.createElement(ItemIconImage, { value }), /* @__PURE__ */ React97.createElement(ItemLabelImage, { value })));
 var ItemIconImage = ({ value }) => {
   const { imageUrl } = useImage(value);
   return /* @__PURE__ */ React97.createElement(
@@ -5560,9 +5570,9 @@ var getFileExtensionFromFilename = (filename) => {
 
 // src/styles-inheritance/transformers/background-overlay-transformer.tsx
 var React98 = __toESM(require("react"));
-var import_editor_canvas8 = require("@elementor/editor-canvas");
+var import_editor_canvas9 = require("@elementor/editor-canvas");
 var import_ui51 = require("@elementor/ui");
-var backgroundOverlayTransformer = (0, import_editor_canvas8.createTransformer)((values) => {
+var backgroundOverlayTransformer = (0, import_editor_canvas9.createTransformer)((values) => {
   if (!values || values.length === 0) {
     return null;
   }
@@ -5571,7 +5581,7 @@ var backgroundOverlayTransformer = (0, import_editor_canvas8.createTransformer)(
 
 // src/styles-inheritance/init-styles-inheritance-transformers.ts
 function initStylesInheritanceTransformers() {
-  const originalStyleTransformers = import_editor_canvas9.styleTransformersRegistry.all();
+  const originalStyleTransformers = import_editor_canvas10.styleTransformersRegistry.all();
   Object.entries(originalStyleTransformers).forEach(([propType, transformer]) => {
     if (excludePropTypeTransformers.has(propType)) {
       return;
@@ -5579,7 +5589,7 @@ function initStylesInheritanceTransformers() {
     stylesInheritanceTransformersRegistry.register(propType, transformer);
   });
   stylesInheritanceTransformersRegistry.registerFallback(
-    (0, import_editor_canvas9.createTransformer)((value) => {
+    (0, import_editor_canvas10.createTransformer)((value) => {
       return value;
     })
   );